<!--
 * @Author: your name
 * @Date: 2022-04-27 09:37:46
 * @LastEditTime: 2024-03-14 15:03:26
 * @LastEditors: 番茄炒蛋蛋 wzh15802755802@163.com
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \jzjy\src\views\ResourceCenter\index.vue
-->

<template>
  <!-- 资源中心页 -->
  <div id="container">
    <div class="gaoyier" v-if="dingzhiNj_id != 11">
      <div class="resTop">
        <div class="head">
          <div class="title">
            <h4>当前教学计划进度：</h4>
            <p>
              {{ base_title }}
            </p>
            <img src="../../assets/img/resource/doing.png" alt="" />
          </div>
          <div class="change" @click="goEditPlan" v-if="jxjh_edit == 1">
            <img src="../../assets/img/resource/edit.png" alt="" />
            调整教学计划
          </div>
        </div>
        <div class="monthNow">{{ monthNow }}月</div>
        <div class="dateNow">
          <span
            v-for="(item, index) in currentMonthCount"
            :key="item"
            :class="{
              planDate: index >= scolorTime - 1 && index <= ecolorTime - 1,
            }"
            >{{ item }}</span
          >
          <div class="mask"></div>
          <img src="../../assets/img/resource/today.png" alt="" class="today" />
        </div>
        <div class="dingzhi" v-if="kejianbao_nums > 0 || kejian_nums > 0">
          <div class="title2">
            <h2>定制推荐</h2>
            <span v-if="kejianbao_nums != 0"
              ><a>{{ kejianbao_nums }}</a
              >份资源包</span
            >
            <span v-if="kejian_nums > 0"
              ><a>{{ kejian_nums }}</a
              >份资源</span
            >
          </div>
          <p v-html="contents"></p>
        </div>
        <div
          class="beikeTaps"
          v-if="
            gyezy1 > 0 ||
            gyesp1 > 0 ||
            gyezy2 > 0 ||
            gyesp2 > 0 ||
            gyezy3 > 0 ||
            gyesp3 > 0
          "
        >
          <el-radio-group
            v-model="dingzhiRadio"
            size="medium"
            text-color="#fff"
            @change="dingzhiChange"
          >
            <el-radio-button label="1" v-if="gyezy1 > 0 || gyesp1 > 0">
              <img
                src="../../assets/img/images/indexTab_1.png"
                v-show="dingzhiRadio == '1'"
              />
              <div v-show="dingzhiRadio != '1'">
                <img src="../../assets/img/images/indexTab_4.png" /> 教师教研
              </div>
            </el-radio-button>
            <el-radio-button label="2" v-if="gyezy2 > 0 || gyesp2 > 0"
              ><img
                src="../../assets/img/images/indexTab_2.png"
                v-show="dingzhiRadio == '2'"
              />
              <div v-show="dingzhiRadio != '2'">
                <img src="../../assets/img/images/indexTab_6.png" />教师教学
              </div></el-radio-button
            >
            <el-radio-button label="3" v-if="gyezy3 > 0 || gyesp3 > 0"
              ><img
                src="../../assets/img/images/indexTab_3.png"
                v-show="dingzhiRadio == '3'"
              />
              <div v-show="dingzhiRadio != '3'">
                <img src="../../assets/img/images/indexTab_5.png" />学生学习
              </div></el-radio-button
            >
          </el-radio-group>
        </div>
      </div>
      <div
        class="recommend"
        v-if="
          gyezy1 > 0 ||
          gyesp1 > 0 ||
          gyezy2 > 0 ||
          gyesp2 > 0 ||
          gyezy3 > 0 ||
          gyesp3 > 0
        "
      >
        <div class="recommend">
          <div class="someRecommend">
            <div class="resMsg">
              <div class="msg">
                <p
                  v-html="contents1 ? contents1 : '暂无内容'"
                  v-show="dingzhiRadio == '1'"
                ></p>
                <p
                  v-html="contents2 ? contents2 : '暂无内容'"
                  v-show="dingzhiRadio == '2'"
                ></p>
                <p
                  v-html="contents3 ? contents3 : '暂无内容'"
                  v-show="dingzhiRadio == '3'"
                ></p>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '1' && gyezy1 > 0"
              >
                <h3>备课资源包</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '2' && gyezy2 > 0"
              >
                <h3>教学资源包</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '3' && gyezy3 > 0"
              >
                <h3>复习资源包</h3>
              </div>
              <div
                class="beike"
                v-for="item in gyezyLists"
                :key="item.id"
                @mouseenter="beikeMouseEnter(item.id)"
              >
                <div class="beike1" v-show="!beikeFlag && n == item.id">
                  <div class="left">
                    <img
                      src="../../assets/img/ziyuan.png"
                      v-if="item.lx == 2"
                      style="height: 80px"
                    />
                    <img
                      src="../../assets/img/resFile (1).png"
                      alt="file_url"
                      v-if="
                        item.suffix == 'ppt' ||
                        item.suffix == 'pptx' ||
                        item.suffix == 'ppsx' ||
                        item.suffix == 'pps'
                      "
                    />
                    <img
                      src="../../assets/img/resFile (2).png"
                      alt="file_url"
                      v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                    />
                    <img
                      src="../../assets/img/resFile (3).png"
                      alt="file_url"
                      v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                    />
                    <img
                      src="../../assets/img/resFile (4).png"
                      alt="file_url"
                      v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                    />
                    <img
                      src="../../assets/img/resFile (5).png"
                      alt="file_url"
                      v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                    />
                    <img
                      src="../../assets/img/resFile (6).png"
                      alt="file_url"
                      v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                    />
                    <img
                      src="../../assets/img/resFile (7).png"
                      alt="file_url"
                      v-if="item.suffix == 'pdf'"
                    />
                    <img
                      src="../../assets/img/resFile (8).png"
                      alt="file_url"
                      v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                    />
                  </div>
                  <div class="details">
                    <div class="title">
                      <h3 @click="goresDetails(item.id, item.lx,item.suffix)">
                        <span v-if="item.is_tj == 1">推荐</span>
                        {{ item.title }}
                      </h3>
                    </div>
                    <div class="msg">
                      <p v-html="item.intro" v-if="item.lx == 1"></p>
                      <p v-html="item.sub_info" v-if="item.lx == 2"></p>
                      <!-- <span style="heigth: 8px" class="shengluehao"
                        >......</span
                      > -->
                      <div class="bottom">
                        <span class="upTime"
                          >更新于{{
                            timeStamp2String(item.update_time * 1000, 2)
                          }}</span
                        >
                        <!-- <span
                          class="upTime"
                          v-if="item.from_int == 21 || item.lx == 2"
                          >更新于{{
                            timeStamp2String(item.update_time * 1000, 2)
                          }}</span
                        >
                        <span
                          class="upTime"
                          v-if="item.from_int == 10"
                          style="color: #ff9b04"
                        >
                          精选
                        </span> -->
                        <span class="seeNum" v-if="item.lx == 1"
                          ><i class="el-icon-view"></i
                          >{{ item.viewCount }}</span
                        >
                        <span class="seeNum" v-if="item.lx == 2"
                          ><i class="el-icon-view"></i
                          >{{ item.view_nums }}</span
                        >
                        <span
                          class="recNum"
                          v-if="item.lx == 2 && kejian_nums > 1"
                          >共<a>{{ item.kejian_nums }}</a
                          >份资源</span
                        >
                      </div>
                    </div>
                  </div>
                  <div
                    class="seeAll"
                    @click="goresDetails(item.id, item.lx,item.suffix)"
                    v-show="!beikeFlag && n == item.id"
                  >
                    <span>查看全部</span>
                  </div>
                </div>
                <div class="beike2" v-show="!beikeFlag && n != item.id">
                  <div class="left">
                    <img
                      src="../../assets/img/ziyuan.png"
                      v-if="item.lx == 2"
                      style="height: 60px"
                    />
                    <img
                      src="../../assets/img/resFile (1).png"
                      alt="file_url"
                      v-if="
                        item.suffix == 'ppt' ||
                        item.suffix == 'pptx' ||
                        item.suffix == 'ppsx' ||
                        item.suffix == 'pps'
                      "
                    />
                    <img
                      src="../../assets/img/resFile (2).png"
                      alt="file_url"
                      v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                    />
                    <img
                      src="../../assets/img/resFile (3).png"
                      alt="file_url"
                      v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                    />
                    <img
                      src="../../assets/img/resFile (4).png"
                      alt="file_url"
                      v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                    />
                    <img
                      src="../../assets/img/resFile (5).png"
                      alt="file_url"
                      v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                    />
                    <img
                      src="../../assets/img/resFile (6).png"
                      alt="file_url"
                      v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                    />
                    <img
                      src="../../assets/img/resFile (7).png"
                      alt="file_url"
                      v-if="item.suffix == 'pdf'"
                    />
                    <img
                      src="../../assets/img/resFile (8).png"
                      alt="file_url"
                      v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                    />
                  </div>
                  <div class="details">
                    <div class="title">
                      <h3>
                        <span v-if="item.is_tj == 1" style="marginright: 10px"
                          >推荐</span
                        >{{ item.title }}
                      </h3>
                    </div>
                    <div class="msg">
                      <div class="bottom">
                        <span class="upTime"
                          >更新于{{
                            timeStamp2String(item.update_time * 1000, 2)
                          }}</span
                        >
                        <span class="seeNum" v-if="item.lx == 1"
                          ><i class="el-icon-view"></i
                          >{{ item.viewCount }}</span
                        >
                        <span class="seeNum" v-if="item.lx == 2"
                          ><i class="el-icon-view"></i
                          >{{ item.view_nums }}</span
                        >
                        <span
                          class="recNum"
                          v-if="item.lx == 2 && kejian_nums > 1"
                          >共<a>{{ item.kejian_nums }}</a
                          >份资源</span
                        >
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '1' && gyesp1 > 0"
              >
                <h3>教研课</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '2' && gyesp2 > 0"
              >
                <h3>教学课</h3>
              </div>
              <div
                class="littleTittle"
                v-show="dingzhiRadio == '3' && gyesp3 > 0"
              >
                <h3>学生学习课</h3>
              </div>
              <div class="jiaoyan">
                <div
                  class="box"
                  v-for="item in gyespLists"
                  :key="item.jyjxkinfo_id"
                  @click="goJiaoyanclass(item.jyjxk_id)"
                >
                  <img :src="item.fm_file_url" alt="" />
                  <div class="activename">
                    {{ item.title }}
                  </div>
                  <p>主讲人：{{ item.teachers_title }}</p>
                </div>
              </div>
            </div>
          </div>
          <div class="test" v-if="fk_status == 0 && fkshow">
            <p>以上推荐对你是否有用？</p>
            <el-radio-group v-model="radio" @change="youyong">
              <el-radio label="0">没用</el-radio>
              <el-radio label="1">有用</el-radio>
            </el-radio-group>
            <button @click="submitTest">提交</button>
          </div>
        </div>
      </div>
    </div>
    <div class="gaosan" v-if="dingzhiNj_id == 11">
      <div class="resTop">
        <div class="head">
          <div class="title">
            <h4>当前教学计划进度：</h4>
            <p>
              {{ base_title }}
            </p>
            <img src="../../assets/img/resource/doing.png" alt="" />
          </div>
          <div class="change" @click="goEditPlan" v-if="jxjh_edit == 1">
            <img src="../../assets/img/resource/edit.png" alt="" />
            调整教学计划
          </div>
        </div>
        <div class="dateNow">
          <span
            v-for="(item, index) in currentMonthCount"
            :key="item"
            :class="{
              planDate: index >= scolorTime - 1 && index <= ecolorTime - 1,
            }"
            >{{ item }}</span
          >
          <div class="mask"></div>
          <img src="../../assets/img/resource/today.png" alt="" class="today" />
        </div>
        <div class="dingzhi">
          <div class="title2">
            <h2>定制推荐</h2>
            <span v-if="kejianbao_nums != 0"
              ><a>{{ kejianbao_nums }}</a
              >份资源包</span
            >
            <span v-if="kejian_nums != 0"
              ><a>{{ kejian_nums }}</a
              >份资源</span
            >
          </div>
          <p v-html="contents"></p>
        </div>
        <div class="beikeTaps">
          <el-radio-group
            v-model="dingzhiRadio"
            size="medium"
            text-color="#fff"
            @change="dingzhiChange"
          >
            <el-radio-button
              label="1"
              v-if="gszy1 > 0 || gszx1 > 0 || gssp1 > 0"
            >
              <img
                src="../../assets/img/images/gsTap1.png"
                v-show="dingzhiRadio == '1'"
              />
              <div v-show="dingzhiRadio != '1'">
                <img src="../../assets/img/gstap1.1.png" /> 一轮复习
              </div>
            </el-radio-button>
            <el-radio-button
              label="2"
              v-if="gszy2 > 0 || gszx2 > 0 || gssp2 > 0"
              ><img
                src="../../assets/img/images/gsTap2.png"
                v-show="dingzhiRadio == '2'"
              />
              <div v-show="dingzhiRadio != '2'">
                <img src="../../assets/img/gstap1.2.png" />二轮复习
              </div></el-radio-button
            >
            <el-radio-button
              label="4"
              v-if="gszy3 > 0 || gszx3 > 0 || gssp3 > 0"
              ><img
                src="../../assets/img/images/gsTap3.png"
                v-show="dingzhiRadio == '4'"
              />
              <div v-show="dingzhiRadio != '4'">
                <img src="../../assets/img/gstap1.4.png" />试卷
              </div></el-radio-button
            >
          </el-radio-group>
        </div>
      </div>
      <div class="gsContents" v-if="!gaosanEnglish">
        <div class="left">
          <div class="leftTitle">
            <h2>最新资源</h2>
            <span @click="gogszy">查看全部</span>
          </div>
          <div
            class="gsResbox"
            v-for="item in gszyLists"
            :key="item.id"
            @mouseenter="gsbeikeMouseEnter(item.id)"
          >
            <div
              class="kejianBox1"
              v-show="!beikeFlag && gs == item.id"
              @click="goresDetails(item.id, item.lx,item.suffix)"
            >
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="msg">
                <div class="title">{{ item.title }}</div>
                <div class="bottom">
                  <span class="upTime" v-if="item.from_int != 10">
                    更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                  </span>
                  <span
                    class="upTime"
                    v-if="item.from_int == 10"
                    style="color: #ff9b04"
                  >
                    精选
                  </span>
                  <span class="seeNum" v-if="!item.lx || item.lx == 1"
                    ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                  >
                  <span class="seeNum" v-if="item.lx == 2"
                    ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                  >
                </div>
              </div>
            </div>
            <div class="kejianBox2" v-show="!beikeFlag && gs != item.id">
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="title">{{ item.title }}</div>
              <span>{{ timeStamp2String(item.update_time * 1000, 3) }}</span>
            </div>
          </div>
          <div class="nothingGszy" v-if="nothingShow">
            <img src="../../assets/img/nothing.png" alt="" />
          </div>
        </div>
        <div class="right">
          <h2>专项资源</h2>
          <div
            class="gsResbox"
            v-if="dingzhiRadio == '1' || dingzhiRadio == '2'"
          >
            <div
              class="picTap1"
              v-for="(item, index) in gszxLists"
              :key="index"
              @click="
                gogszx(
                  item.kejianbooks_id,
                  item.kejianchapters_id,
                  item.kejianfl_id,
                  item.kejiantag_id,
                  item.kemu_id,
                  item.nianji_id,
                  item.title,
                  item.type_id,
                  index
                )
              "
            >
              <img :src="item.file_url" alt="" />
            </div>
          </div>
          <div class="gsResbox" v-if="dingzhiRadio == '4'">
            <div
              class="picTap2"
              v-for="(item, index) in gszxLists"
              :key="index"
              @click="
                gogszx(
                  item.kejianbooks_id,
                  item.kejianchapters_id,
                  item.kejianfl_id,
                  item.kejiantag_id,
                  item.kemu_id,
                  item.nianji_id,
                  item.title,
                  item.type_id,
                  index
                )
              "
            >
              <img :src="item.file_url" alt="" />
            </div>
          </div>
        </div>
      </div>
      <div class="gsContents" v-if="gaosanEnglish">
        <div class="left" v-show="dingzhiRadio != 2">
          <div class="leftTitle">
            <h2 v-show="dingzhiRadio == 1">词汇</h2>
            <h2 v-show="dingzhiRadio == 2">最新资源</h2>
            <span @click="gogszyNewCh">查看全部</span>
          </div>
          <div
            class="gsResbox"
            v-for="item in gsEnYlChList.slice(0, 4)"
            :key="item.id"
            @mouseenter="gsbeikeMouseEnteryilunCh(item.id)"
          >
            <div
              class="kejianBox1"
              v-show="!beikeFlag && gsyilunCh == item.id"
              @click="goresDetails(item.id, item.lx,item.suffix)"
            >
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="msg">
                <div class="title">{{ item.title }}</div>
                <div class="bottom">
                  <span class="upTime" v-if="item.from_int != 10">
                    更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                  </span>
                  <span
                    class="upTime"
                    v-if="item.from_int == 10"
                    style="color: #ff9b04"
                  >
                    精选
                  </span>
                  <span class="seeNum" v-if="!item.lx || item.lx == 1"
                    ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                  >
                  <span class="seeNum" v-if="item.lx == 2"
                    ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                  >
                </div>
              </div>
            </div>
            <div class="kejianBox2" v-show="!beikeFlag && gsyilunCh != item.id">
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="title">{{ item.title }}</div>
              <span>{{ timeStamp2String(item.update_time * 1000, 3) }}</span>
            </div>
          </div>
          <div class="nothingGszy" v-if="nothingShow">
            <img src="../../assets/img/nothing.png" alt="" />
          </div>
        </div>
        <div class="left" v-show="dingzhiRadio != 2">
          <div class="leftTitle">
            <h2>语法</h2>
            <span @click="gogszyNewYf">查看全部</span>
          </div>
          <div
            class="gsResbox"
            v-for="item in gsEnYlYfList.slice(0, 4)"
            :key="item.id"
            @mouseenter="gsbeikeMouseEnteryilunYf(item.id)"
          >
            <div
              class="kejianBox1"
              v-show="!beikeFlag && gsyilunYf == item.id"
              @click="goresDetails(item.id, item.lx,item.suffix)"
            >
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="msg">
                <div class="title">{{ item.title }}</div>
                <div class="bottom">
                  <span class="upTime" v-if="item.from_int != 10">
                    更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                  </span>
                  <span
                    class="upTime"
                    v-if="item.from_int == 10"
                    style="color: #ff9b04"
                  >
                    精选
                  </span>
                  <span class="seeNum" v-if="!item.lx || item.lx == 1"
                    ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                  >
                  <span class="seeNum" v-if="item.lx == 2"
                    ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                  >
                </div>
              </div>
            </div>
            <div class="kejianBox2" v-show="!beikeFlag && gsyilunYf != item.id">
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="title">{{ item.title }}</div>
              <span>{{ timeStamp2String(item.update_time * 1000, 3) }}</span>
            </div>
          </div>
          <div class="nothingGszy" v-if="nothingShow">
            <img src="../../assets/img/nothing.png" alt="" />
          </div>
        </div>
        <div class="left gserlun" v-show="dingzhiRadio == 2">
          <div class="leftTitle">
            <h2>最新资源</h2>
            <!-- <span @click="gogszy">查看全部</span> -->
          </div>
          <div
            class="gsResbox"
            v-for="item in gsEnYlChList.slice(0, 4)"
            :key="item.id"
            @mouseenter="gsbeikeMouseEntererlunL(item.id)"
          >
            <div
              class="kejianBox1"
              v-show="!beikeFlag && gserlunL == item.id"
              @click="goresDetails(item.id, item.lx,item.suffix)"
            >
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="msg">
                <div class="title">{{ item.title }}</div>
                <div class="bottom">
                  <span class="upTime" v-if="item.from_int != 10">
                    更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                  </span>
                  <span
                    class="upTime"
                    v-if="item.from_int == 10"
                    style="color: #ff9b04"
                  >
                    精选
                  </span>
                  <span class="seeNum" v-if="!item.lx || item.lx == 1"
                    ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                  >
                  <span class="seeNum" v-if="item.lx == 2"
                    ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                  >
                </div>
              </div>
            </div>
            <div class="kejianBox2" v-show="!beikeFlag && gserlunL != item.id">
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="title">{{ item.title }}</div>
              <span>{{ timeStamp2String(item.update_time * 1000, 3) }}</span>
            </div>
          </div>
          <div class="nothingGszy" v-if="nothingShow">
            <img src="../../assets/img/nothing.png" alt="" />
          </div>
        </div>
        <div class="left gserlun gserlunTips" v-show="dingzhiRadio == 2">
          <div class="leftTitle">
            <h2>&nbsp;&nbsp;&nbsp;</h2>
            <span @click="gogszy">查看全部</span>
          </div>
          <div
            class="gsResbox"
            v-for="item in gsEnYlChList.slice(4, 8)"
            :key="item.id"
            @mouseenter="gsbeikeMouseEntererlunR(item.id)"
          >
            <div
              class="kejianBox1"
              v-show="!beikeFlag && gserlunR == item.id"
              @click="goresDetails(item.id, item.lx,item.suffix)"
            >
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="msg">
                <div class="title">{{ item.title }}</div>
                <div class="bottom">
                  <span class="upTime" v-if="item.from_int != 10">
                    更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                  </span>
                  <span
                    class="upTime"
                    v-if="item.from_int == 10"
                    style="color: #ff9b04"
                  >
                    精选
                  </span>
                  <span class="seeNum" v-if="!item.lx || item.lx == 1"
                    ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                  >
                  <span class="seeNum" v-if="item.lx == 2"
                    ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                  >
                </div>
              </div>
            </div>
            <div class="kejianBox2" v-show="!beikeFlag && gserlunR != item.id">
              <div class="kejianfile">
                <img
                  src="../../assets/img/ziyuan.png"
                  v-if="item.lx == 2"
                  style="height: 74px"
                />
                <img
                  src="../../assets/img/resFile (1).png"
                  alt="file_url"
                  v-if="
                    item.suffix == 'ppt' ||
                    item.suffix == 'pptx' ||
                    item.suffix == 'ppsx' ||
                    item.suffix == 'pps'
                  "
                />
                <img
                  src="../../assets/img/resFile (2).png"
                  alt="file_url"
                  v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
                />
                <img
                  src="../../assets/img/resFile (3).png"
                  alt="file_url"
                  v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
                />
                <img
                  src="../../assets/img/resFile (4).png"
                  alt="file_url"
                  v-if="item.suffix == 'zip' || item.suffix == 'rar'"
                />
                <img
                  src="../../assets/img/resFile (5).png"
                  alt="file_url"
                  v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
                />
                <img
                  src="../../assets/img/resFile (6).png"
                  alt="file_url"
                  v-if="item.suffix == 'doc' || item.suffix == 'docx'"
                />
                <img
                  src="../../assets/img/resFile (7).png"
                  alt="file_url"
                  v-if="item.suffix == 'pdf'"
                />
                <img
                  src="../../assets/img/resFile (8).png"
                  alt="file_url"
                  v-if="item.suffix == 'png' || item.suffix == 'jpg'"
                />
              </div>
              <div class="title">{{ item.title }}</div>
              <span>{{ timeStamp2String(item.update_time * 1000, 3) }}</span>
            </div>
          </div>
          <div class="nothingGszy" v-if="nothingShow">
            <img src="../../assets/img/nothing.png" alt="" />
          </div>
        </div>
      </div>
      <div class="recommend">
        <div class="recommend">
          <div class="someRecommend">
            <div class="resMsg" v-if="gsspLists.length > 0">
              <div class="littleTittle">
                <h3>课程推荐</h3>
              </div>
              <div class="jiaoyan">
                <div
                  class="box jiaoyanbox"
                  v-for="item in gsspLists"
                  :key="item.jyjxkinfo_id"
                  @click="goJiaoyanclass(item.jyjxk_id)"
                >
                  <img :src="item.fm_file_url" alt="" />
                  <div class="activename">
                    {{ item.title }}
                  </div>
                  <p>主讲人：{{ item.teachers_title }}</p>
                </div>
              </div>
            </div>
          </div>
          <div class="test" v-if="fk_status == 0 && fkshow">
            <p>以上推荐对你是否有用？</p>
            <el-radio-group v-model="radio" @change="youyong">
              <el-radio label="0">没用</el-radio>
              <el-radio label="1">有用</el-radio>
            </el-radio-group>
            <button @click="submitTest">提交</button>
          </div>
        </div>
      </div>
    </div>
    <div class="ziyuanku">
      <div class="top" ref="scroll">
        <div class="title">
          <h3>资源库</h3>
          <h4>10000+</h4>
          <span>份资源</span>
          <p>* 已由平台编辑完成内容校对</p>
        </div>
        <div class="search">
          <el-input
            prefix-icon="el-icon-search"
            placeholder="输入关键词搜索"
            v-model="input"
            @keyup.enter.native="handleAddBook"
            @change="handleAddBook"
          ></el-input>
        </div>
      </div>
    </div>
    <div class="content">
      <div class="resFl">
        <h2>资源分类</h2>
        <div class="box">
          <el-collapse v-model="kejianbooks_id" accordion @change="handleBook">
            <el-collapse-item
              :name="item.id"
              v-for="(item,index) in booksList"
              :key="item.id"
            >
              <template slot="title">
                <div
                  class="title"
                  :class="{ books_chose: kejianbooks_id == item.id }"
                  @click="choseBook(item.nianji_id, item.title,index)"
                >
                  <h3>{{ item.title }}</h3>
                  <i
                    class="el-icon-arrow-up"
                    v-show="kejianbooks_id != item.id"
                  ></i>
                  <i
                    class="el-icon-arrow-down"
                    v-show="kejianbooks_id == item.id"
                  ></i>
                </div>
              </template>
              <el-tree
                :data="mululist"
                :props="defaultProps"
                :highlight-current="true"
                accordion
                icon-class="el-icon-circle-plus-outline"
                @node-click="handleNodeClick"
                node-key="id"
                :default-expanded-keys="[kejianchapters_id]"
                empty-text="暂无数据"
              ></el-tree>
            </el-collapse-item>
          </el-collapse>
        </div>
      </div>
      <div class="right">
        <!-- 课件分类，右侧横向tap -->
        <div class="kejianTaps">
          <!-- <span class="allTaps">全部</span> -->
          <div
            class="flname"
            v-for="item in kejianflList"
            :key="item.id"
            @click="choseKejianfl(item.id, item.systypes_id, item.title)"
          >
            <span
              ><a :class="{ fenlei_color: kejianfl_id == item.id }">{{
                item.title
              }}</a></span
            >
          </div>
        </div>
        <!-- 课件标签分类,二级tap -->
        <div class="paper" v-if="kejiantagShow && kejianfl_id < 10000">
          <div class="taps2">
            <span>标签：</span>
            <span
              :class="{
                paixu_color: paper_radio == item.id && paper_radio != '',
              }"
              @click="choseTagfl(item.id, item.title)"
              v-for="item in kejianfltaglist"
              :key="item.id"
              >{{ item.title }}</span
            >
          </div>
        </div>
        <!-- 教研课和教学课的标签 -->
        <div class="paper" v-if="kejianfl_id == 10000 || kejianfl_id == 10001">
          <div class="taps2">
            <span>排序：</span>
            <span
              :class="{
                paixu_color: paper_radio == item.id && paper_radio != '',
              }"
              @click="chosejyjxTagfl(item.id, item.title)"
              v-for="item in jyjxTagList"
              :key="item.id"
              >{{ item.title }}</span
            >
          </div>
        </div>
        <!-- 课件列表  正常课件模块-->
        <div class="kejianlist">
          <div
            class="kejianBox"
            v-for="item in kejianLists"
            :key="item.id"
            v-show="kejianLists != [] && kejianfl_id < 10000"
            @click="goresDetails(item.id, item.lx,item.suffix)"
          >
            <div class="kejianfile">
              <img
                src="../../assets/img/ziyuan.png"
                v-if="item.lx == 2"
                style="height: 74px"
              />
              <img
                src="../../assets/img/resFile (1).png"
                alt="file_url"
                v-if="
                  item.suffix == 'ppt' ||
                  item.suffix == 'pptx' ||
                  item.suffix == 'ppsx' ||
                  item.suffix == 'pps'
                "
              />
              <img
                src="../../assets/img/resFile (2).png"
                alt="file_url"
                v-if="item.suffix == 'mp4' || item.suffix == 'rm'"
              />
              <img
                src="../../assets/img/resFile (3).png"
                alt="file_url"
                v-if="item.suffix == 'xls' || item.suffix == 'xlsx'"
              />
              <img
                src="../../assets/img/resFile (4).png"
                alt="file_url"
                v-if="item.suffix == 'zip' || item.suffix == 'rar'"
              />
              <img
                src="../../assets/img/resFile (5).png"
                alt="file_url"
                v-if="item.suffix == 'm4a' || item.suffix == 'mp3'"
              />
              <img
                src="../../assets/img/resFile (6).png"
                alt="file_url"
                v-if="item.suffix == 'doc' || item.suffix == 'docx'"
              />
              <img
                src="../../assets/img/resFile (7).png"
                alt="file_url"
                v-if="item.suffix == 'pdf'"
              />
              <img
                src="../../assets/img/resFile (8).png"
                alt="file_url"
                v-if="item.suffix == 'png' || item.suffix == 'jpg'"
              />
            </div>
            <div class="msg">
              <div class="title">{{ item.title }}</div>
              <!-- <p v-if="!item.lx || item.lx == 1" style="height: 80px">
              {{ item.intro == "" ? "暂无" : item.intro }}
            </p> -->
              <p v-html="item.sub_info" v-if="item.lx == 2"></p>
              <span v-if="item.lx == 2">......</span>
              <div class="bottom">
                <span class="upTime" v-if="item.from_int != 10">
                  更新于{{ timeStamp2String(item.update_time * 1000, 2) }}
                </span>
                <span
                  class="upTime"
                  v-if="item.from_int == 10"
                  style="color: #ff9b04"
                >
                  精选
                </span>
                <!-- <span class="rate"><span style="margin-right:5px">精选指数</span> <el-rate disabled v-model="item.tjzs"></el-rate></span> -->
                <span class="seeNum" v-if="!item.lx || item.lx == 1"
                  ><i class="el-icon-view"></i>{{ item.viewCount }}</span
                >
                <span class="seeNum" v-if="item.lx == 2"
                  ><i class="el-icon-view"></i>{{ item.view_nums }}</span
                >
              </div>
            </div>
            <div class="downLoad">查看全部</div>
          </div>
        </div>

        <!-- 课件列表 教研课和教学课模块-->
        <div
          class="kejianlist"
          v-if="kejianLists.length != 0 && kejianfl_id >= 10000"
        >
          <div
            class="kejianBox"
            v-show="kejianLists != [] && kejianfl_id >= 10000"
          >
            <div class="jiaoyan">
              <div
                class="box jiaoyanbox"
                v-for="item in kejianLists"
                :key="item.jyjxkinfo_id"
                @click="goJiaoyanclass(item.jyjxk_id)"
              >
                <img :src="item.fm_file_url" alt="" />
                <div class="activename">
                  {{ item.title }}
                </div>
                <p>主讲人：{{ item.teachers_title }}</p>
              </div>
            </div>
          </div>
        </div>
        <!-- 空图是否展示 -->
        <div class="nothing" v-show="kejianLists.length == 0">
          <p>抱歉，没有为您搜索到相关内容，可以去看看其他资源哦！</p>
          <img src="../../assets/img/nothing.png" alt="" />
        </div>

        <!-- 分页部分 -->
        <div class="page1" v-if="kejianLists.length > 0">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page.sync="currentPage"
            background
            :page-sizes="[5, 10, 20]"
            :page-size="100"
            layout="total, sizes, prev, pager, next, jumper"
            :total="counts"
          >
          </el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { timeStamp2String } from "../../utils/time";
import {
  list_kejianbao,
  kejianfl,
  list_kejiantag,
  nowkemu,
  userinfo,
  bookslists,
  chapterslists,
  list_kejian,
  chaptersinfo,
  jyjxkinfolists,
  tjlists,
  zyzxinfo,
  zyzxgs,
  zyzxfk,
  list_jyjxk,
  chapterskejian,
} from "../../api/http";
export default {
  name: "resourceCenter",
  data() {
    return {
      rateValue:3,
      gundongTop: 0, //滚动条高度
      zyzxMsg: {}, //资源数据汇总信息
      base_title: "123", //当前计划名称标题
      kejianbooks_title: "", //当前学习的书本名
      kejianchapters_title: "", //当前学习的目录名
      jxjh_edit: "", //是否有权力编写教学计划
      timeLine: {}, //关键事件节点对象
      //用于顶部日期时间尺子
      monthNow: "", //当前几月
      currentMonthCount: 0, //本月天数
      nextMonthCount: 0, //下个月天数
      fenlei_radio: 1, //试卷分类值
      scrollY: 0, //资源库距离顶部位置
      start_date: "", //当前计划开始时间
      end_date: "", //当前计划结束时间
      stime: "", //开始的那一天
      etime: "", //结束的那天
      scolorTime: "", //时间尺绿色开始日期
      ecolorTime: "", //时间尺绿色开始日期
      smonth: "", //计划开始的月份
      emonth: "", //计划结束的月份
      kejianbao_nums: "", //资源包数量
      kejian_nums: "", //资源数量

      timeStamp2String, //时间戳转时间的函数

      // 资源定制部分
      dingzhishow: true, //定制部分是否展示
      //资源包信息介绍
      dingzhiNj_id: "", //用户个人当前的年级id
      contents: "", //整理来源介绍
      contents1: "", //教师教研介绍//一轮复习介绍
      contents2: "", //教师教学介绍//二轮复习介绍
      contents3: "", //学生学习介绍//三轮复习介绍 //暂无
      contents4: "", //真题试卷介绍
      //资源包下的教研课的视频列表

      dingzhiRadio: "1", //定制切换栏按钮默认值

      //高一高二
      gyezyLists: [], //教师教研课件包资
      gyespLists: [], //教师教学课件包数量
      gyezy1: 0, //高一二部分教师教研资源数量
      gyezy2: 0, //高一二部分教师教学资源数量
      gyezy3: 0, //高一二部分学生学习资源数量

      gyesp1: 0, //高一二部分教师教研视频数量
      gyesp2: 0, //高一二部分教师教学视频数量
      gyesp3: 0, //高一二部分学生学习视频数量

      radio: "1", //调查有用没用
      beikeFlag: false, //资源包hover样式切换
      n: 0, //当前鼠标移动到的资源包的id

      //高三部分
      gszyLists: [], //高三部分的最新资源列表
      gszxLists: [], //高三部分的专项列表
      gsspLists: [], //高三部分的视频列表
      gszy1: 0, //一轮复习课件包数量
      gszy2: 0, //二轮复习课件包数量
      gszy3: 0, //试卷课件包数量
      gszx1: 0, //一轮复习专项数量
      gszx2: 0, //二轮复习专项数量
      gszx3: 0, //试卷专项数量
      gssp1: 0, //一轮复习视频数量
      gssp2: 0, //二轮复习视频数量
      gssp3: 0, //试卷视频数量
      gs: 0, //高三部分鼠标移动到的资源包id
      gsyilunCh: 0, //高三部分鼠标移动到的资源包id
      gsyilunYf: 0, //高三部分鼠标移动到的资源包id
      gserlunL: 0, //高三部分鼠标移动到的资源包id
      gserlunR: 0, //高三部分鼠标移动到的资源包id
      nothingShow: false, //空图是否展示

      //资源库
      input: "", //资源库搜索框双向绑定内容
      searchTitle: "", //按回车键后保存要上传的搜索关键词
      fenleiRadio: 1, //当前选中的分类值，用于切换课件分类tap
      paper_radio: "", //当前选中的试卷二级分类列表
      currentPage: 1, //分页默认选中页

      //资源库数据的展示
      booksList: [], //左侧书本列表
      mululist: [], //根据书本id获取的目录列表
      defaultProps: {
        //书本目录对应后台数据的默认字段
        children: "lists",
        label: "title",
      },
      // bookNianji_id: 0, //获取图书列表第一本书的所属年级id，用于右侧分类
      kejianflList: [], //课件分类列表
      kejianfltaglist: [], //课件分类下的分类标签
      kejiantag_id: "", //课件分类标签id
      jyjxTagList: [
        { id: "time", title: "最新课程" },
        { id: "xg", title: "相关课程" },
        { id: "play", title: "最多播放" },
      ], //教研课和教学课的标签
      //由下面参数决定资源页课件展示内容，点击切换相关选项可更改展示内容，初始默认内容由个人信息和当前目录版本信息里获取。
      kejianbooks_id: 0, //书本id
      kemu_id: 0, //当前科目id
      nianji_id: 0, //当前年级id
      kejianfl_id: 1, //课件分类id
      kejiantagShow: false, //课件分类下的标签是否展示
      kejianversions_id: 0, //当前版本id
      kejianchapters_id: 0, //目录id
      systypes_id: 1, //系统大分类标签(1.课件.2.试卷.3.素材.4.专项)
      status: "", //状态
      page: 1, //页码
      page_size: 5, //分页大小
      kejianLists: [], //课件资源列表数据
      counts: 0, //当前请求到的课件总条数用于分页显示总数
      fk_status: "", //是否反馈过
      yy_status: "1", //是否有用
      fkshow: true, //提交是否有用的显示隐藏

      //后期添加
      gaosanEnglish: false, //是否为高三英语，高三英语一轮复习和二轮复习页面内容修改
      yilunBook_id: "", //一轮书本id
      erlunBook_id: "", //二轮书本id
      gsEnYlChList: [], //高三英语一轮复习词汇列表
      gsEnYlYfList: [], //高三英语一轮复习语法列表
      gsEnCh: "", //高三英语一轮复习词汇列表第一个课件id
      gsEnYf: "", //高三英语一轮复习词汇列表第一个课件id
      gsEnElList: [], //高三英语二轮复习列表
      cihui_id: "", //高三英语一轮复习词汇目录id
      yufa_id: "", //高三英语一轮复习语法目录id

      //后期添加面包屑筛选记录所需内容
      mb_bookTitle: "", //书本名
      mb_muluTitle: "", //书本目录名
      // mb_kewenTitle: "", //课文名
      mb_tapTitle: "", //分类名
      mb_tagTitle: "", //标签名
      bookIndex:0,//第几本书
      mb_page:1,//记录保存页数
    };
  },
  created() {
    console.log(this.$route.query, "query参数");
    this.gundongTop = this.$route.query.Top;
    document.documentElement.scrollTop = this.gundongTop ? this.gundongTop : 0;
    this.paper_radio = this.$route.query.mb_tag_id
      ? this.$route.query.mb_tag_id
      : "";

    if (this.$route.query.mb_type_id) {
      this.systypes_id = this.$route.query.mb_type_id;
    }
     
    if (
      this.$route.query.mb_searchTitle &&
      this.$route.query.mb_searchTitle != ""
    ) {
      this.searchTitle = this.$route.query.mb_searchTitle;
      this.input = this.$route.query.mb_searchTitle;
    }
    if (this.$route.query.mb_tag_id) {
      this.kejiantag_id = this.$route.query.mb_tag_id;
    }
    if (this.$route.query.mb_bookIndex) {
      this.bookIndex = this.$route.query.mb_bookIndex;
    }
    if (this.$route.query.mb_book_id) {
      this.kejianbooks_id = this.$route.query.mb_book_id;
    }
    if (this.$route.query.mb_tap_id) {
      this.kejianfl_id = this.$route.query.mb_tap_id;
    }
    if (this.$route.query.mb_tapTitle) {
      this.mb_tapTitle = this.$route.query.mb_tapTitle;
    }
    if (this.$route.query.mb_mulu_id) {
      this.kejianchapters_id = this.$route.query.mb_mulu_id;
    }
    if (this.$route.query.mb_tagTitle) {
      this.mb_tagTitle = this.$route.query.mb_tagTitle;
    }
    if (this.$route.query.mb_tag_id) {
      this.kejiantag_id = this.$route.query.mb_tag_id;
    }
    if (this.$route.query.mb_page) {
      this.page = this.$route.query.mb_page;
      this.currentPage = this.$route.query.mb_page;
      this.mb_page = this.$route.query.mb_page;
    }
    console.log(this.$route.query.mb_page,"hahaahahja啊啊哈哈哈哈")
    // //回到顶部
    // $(document).ready(function () {
    //   $(window).scrollTop(this.$route.query.Top );
    // });
    //获取当前个人信息
    userinfo({
      md5key: localStorage.getItem("md5key"),
    }).then((res) => {
      if (
        res.retInt == 1 &&
        res.retRes.sy_end_time * 1000 > Date.parse(new Date())
      ) {
        console.log(res, "个人信息");
        const data = res.retRes;
        this.jxjh_edit = data.jxjh_edit; //是否有权力编写教学计划
        this.dingzhiNj_id = data.nianji_id; //用户个人当前的年级id
        this.nianji_id = this.$route.query.mb_nj_id
          ? this.$route.query.mb_nj_id
          : data.nianji_id; //当前年级id
        console.log(this.nianji_id, "当前年级id");

        if (this.dingzhiNj_id != 11) {
          //获取进入页面后上半部分的资源包和当前计划的高一高二相关数据
          zyzxinfo({
            md5key: localStorage.getItem("md5key"),
          }).then((res) => {
            if (res.retInt == 1) {
              console.log(res, "课件包数据信息汇总");
              const data = res.retRes;
              this.base_title = data.base_title;
              this.start_date = data.start_date; //教学计划开始时间
              this.end_date = data.end_date; //教学计划结束时间
              this.contents = data.contents;
              this.contents1 = data.info_1.contents;
              this.contents2 = data.info_2.contents;
              this.contents3 = data.info_3.contents;
              this.kejianbao_nums = data.kejianbao_nums;
              this.kejian_nums = data.kejian_nums;
              this.zyzxMsg = data; //汇总信息
              this.fk_status = data.fk_status;
              this.gyezy1 = data.info_1.zy_lists.length; //高一二部分教师教研资源数量
              this.gyezy2 = data.info_2.zy_lists.length; //高一二部分教师教学资源数量
              this.gyezy3 = data.info_3.zy_lists.length; //高一二部分学生学习资源数量
              this.gyesp1 = data.info_1.sp_lists.length; //高一二部分教师教研资源数量
              this.gyesp2 = data.info_2.sp_lists.length; //高一二部分教师教学资源数量
              this.gyesp3 = data.info_3.sp_lists.length; //高一二部分学生学习视频数量
              const jiaoyan = this.gyezy1 + this.gyesp1; //教师教研总内容数量
              const jiaoxue = this.gyezy2 + this.gyesp2; //教师教研总内容数量
              const xuesheng = this.gyezy3 + this.gyesp3; //教师教研总内容数量
              if (jiaoyan > 0) {
                this.gyezyLists = data.info_1.zy_lists;
                this.gyespLists = data.info_1.sp_lists;
                this.dingzhiRadio = "1";
              } else if (jiaoyan == 0 && jiaoxue > 0) {
                this.gyezyLists = data.info_2.zy_lists;
                this.gyespLists = data.info_2.sp_lists;
                this.dingzhiRadio = "2";
              } else if (jiaoyan == 0 && jiaoxue == 0 && xuesheng > 0) {
                this.gyezyLists = data.info_3.zy_lists;
                this.gyespLists = data.info_3.sp_lists;
                this.dingzhiRadio = "3";
              }
              // if(this.gyezy1 == 0 && this.gyezy2 == 0 && )
            }
          });
        } else {
          zyzxgs({
            md5key: localStorage.getItem("md5key"),
          }).then((res) => {
            if (res.retInt == 1) {
              console.log(res, "高三资源中心信息汇总");
              const data = res.retRes;
              this.base_title = data.base_title;
              this.start_date = data.start_date; //教学计划开始时间
              this.end_date = data.end_date; //教学计划结束时间
              this.contents = data.contents; //高三定制资源简介
              this.contents1 = data.info_1.contents;
              this.contents2 = data.info_2.contents;
              this.contents4 = data.info_4.contents;
              this.kejianbao_nums = data.kejianbao_nums;
              this.kejian_nums = data.kejian_nums;
              this.zyzxMsg = data; //汇总信息
              this.fk_status = data.fk_status;
              this.gszy1 = data.info_1.zy_lists.length; //一轮复习课件包数量
              this.gszy2 = data.info_2.zy_lists.length; //二轮复习课件包数量
              this.gszy3 = data.info_4.zy_lists.length; //试卷课件包数量
              this.gszx1 = data.info_1.zx_lists.length; //一轮复习专项数量
              this.gszx2 = data.info_2.zx_lists.length; //二轮复习专项数量
              this.gszx3 = data.info_4.zx_lists.length; //试卷专项数量
              this.gssp1 = data.info_1.sp_lists.length; //一轮复习视频数量
              this.gssp2 = data.info_2.sp_lists.length; //二轮复习视频数量
              this.gssp3 = data.info_4.sp_lists.length; //试卷视频数量
              this.yilunBook_id = data.info_1.kejianbooks_id;
              this.erlunBook_id = data.info_2.kejianbooks_id;
              const yilun = this.gszy1 + this.gszx1 + this.gssp1; //一轮复习下的资源总量
              const erlun = this.gszy2 + this.gszx2 + this.gssp2; //二轮复习下的资源总量
              const shijuan = this.gszy3 + this.gszx3 + this.gssp3; //试卷下的资源总量
              // console.log(yilun, erlun, "一轮复习下的资源总量");
              console.log(
                this.yilunBook_id,
                this.erlunBook_id,
                "asaaaaaaaaaaaaaaaaaa"
              );
              if (yilun > 0) {
                this.gszyLists = data.info_1.zy_lists;
                // this.gs = data.info_1.zy_lists[0].id;
                this.gszxLists = data.info_1.zx_lists;
                this.gsspLists = data.info_1.sp_lists;
                this.dingzhiRadio = "1";
                if (this.gszyLists.length > 0) {
                  this.gs = data.info_1.zy_lists[0].id;
                }
                // console.log("一轮一轮一轮一轮一轮一轮一轮一轮一轮一轮一轮一轮一轮一轮")
              } else if ((yilun = 0 && erlun > 0)) {
                this.gszyLists = data.info_2.zy_lists;
                // this.gs = data.info_2.zy_lists[0].id;
                this.gszxLists = data.info_2.zx_lists;
                this.gsspLists = data.info_2.sp_lists;
                this.dingzhiRadio = "2";
                if (this.gszyLists.length > 0) {
                  this.gs = data.info_2.zy_lists[0].id;
                }
                // console.log("二轮二轮二轮二轮二轮二轮二轮二轮二轮二二轮二轮二轮二轮")
              } else if (yilun == 0 && erlun == 0 && shijuan > 0) {
                this.gszyLists = data.info_4.zy_lists;
                // this.gs = data.info_4.zy_lists[0].id;
                this.gszxLists = data.info_4.zx_lists;
                this.gsspLists = data.info_4.sp_lists;
                this.dingzhiRadio = "3";
                if (this.gszyLists.length > 0) {
                  this.gs = data.info_4.zy_lists[0].id;
                }
              }
              if (this.gszyLists.length == 0) {
                this.nothingShow = true;
              } else {
                this.nothingShow = false;
              }
            }
          });
        }

        //获取当前科目和版本
        nowkemu({
          md5key: localStorage.getItem("md5key"),
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "当前科目和版本");
            const data = res.retRes;
            this.status = data.is_now; //是否当前
            //如果当前的版本或科目为0，跳转到选择版本页
            if (data.kejianversions_id == 0 || data.kemu_id == 0) {
              this.$alert("您还未选择学科或版本，请先前往选择", "温馨提示", {
                confirmButtonText: "确定",
                callback: () => {
                  this.$router.push({
                    name: "ChangeClass",
                  });
                },
              });
              //如果当前的计划开始时间结束时间不存在或科目为0，跳转到设置教学计划
            } else if (data.have_plan == 0) {
              this.$alert("您目前还没有教学计划，请先前往设置", "温馨提示", {
                confirmButtonText: "确定",
                callback: () => {
                  this.$router.push({
                    name: "MyTeachPlan",
                  });
                },
              });
            } else {
              this.kejianversions_id = data.kejianversions_id; //当前版本id
              this.kejianchapters_id = this.$route.query.mb_mulu_id && this.$route.query.mb_mulu_id =='0'
                ? this.$route.query.mb_mulu_id
                : data.kejianchapters_id; //当前目录id
                console.log(this.kejianchapters_id,this.$route.query.mb_mulu_id,"//////////////////////////")
              this.kejianbooks_id = this.$route.query.mb_book_id
                ? this.$route.query.mb_book_id
                : data.kejianbooks_id; //当前书本id
              // this.start_date = data.start_date; //教学计划开始时间
              // this.end_date = data.end_date; //教学计划结束时间
              this.kemu_id = data.kemu_id; //当前科目id
              this.kejianbooks_title =this.$route.query.mb_bookTitle?this.$route.query.mb_bookTitle:data.kejianbooks_title; //当前学习的书本名
              this.mb_bookTitle =this.$route.query.mb_bookTitle?this.$route.query.mb_bookTitle:data.kejianbooks_title; //当前学习的书本名
              this.kejianchapters_title = this.$route.query.mb_muluTitle?this.$route.query.mb_muluTitle:data.kejianchapters_title; //当前学习的目录名
              this.mb_muluTitle = this.$route.query.mb_muluTitle?this.$route.query.mb_muluTitle:data.kejianchapters_title; //当前学习的目录名
              this.timeLine = data.timeline;
              console.log(
                this.kejianchapters_id
                // "一进来就要判断的目录id，如果有，正常显示，如果没有，隐藏推荐"
              );
              // 如果是高三英语
              if (
                this.dingzhiNj_id == 11 &&
                this.kemu_id == 3 &&
                this.dingzhiRadio == "1"
              ) {
                this.gaosanEnglish = true;
                setTimeout(() => {
                  chapterskejian({
                    md5key: localStorage.getItem("md5key"),
                    kejianbooks_id: this.yilunBook_id,
                  }).then((res) => {
                    console.log(
                      res,
                      "高三英语一轮复习",
                      res.retRes[0].kejian_lists[0].id
                    );
                    this.gsyilunCh = res.retRes[0].kejian_lists[0].id;
                    this.gsyilunYf = res.retRes[1].kejian_lists[0].id;
                    // console.log(res.retRes[0].id, "asssss");
                    const data = res.retRes;
                    this.gsEnYlChList = res.retRes[0].kejian_lists;
                    this.gsEnYlYfList = res.retRes[1].kejian_lists;
                    this.cihui_id = res.retRes[0].id;
                    this.yufa_id = res.retRes[1].id;
                  });
                }, 200);
              } else {
                this.gaosanEnglish = false;
              }
            }
            //获取书本列表
            bookslists({
              md5key: localStorage.getItem("md5key"),
              kejianversions_id: this.kejianversions_id,
              kemu_id: this.kemu_id,
              // nianji_id: this.nianji_id,
            }).then((res) => {
              if (res.retInt == 1) {
                this.booksList = res.retRes;
                // this.nianji_id = this.booksList[0].nianji_id;
                console.log(res, "书本列表");
                if (this.kejianbooks_id == 0) {
                  this.kejianbooks_id = this.booksList[0].id;
                }
                if (this.$route.query.mb_book_id) {
                  this.booksList.forEach((item,index)=>{
                    if(this.$route.query.mb_book_id == item.id){
                      this.bookIndex = index
                    }
                  })
                  this.kejianbooks_id = this.booksList[this.bookIndex].id;
                  console.log(
                    this.kejianbooks_id,
                    "111111111111111111111111111111111111"
                  );
                }
                //获取书本目录列表
                chapterslists({
                  md5key: localStorage.getItem("md5key"),
                  kejianbooks_id:this.kejianbooks_id,
                  // pid: this.kejianchapters_id,
                }).then((res) => {
                  this.mululist = res.retRes;
                  console.log(res, "书本目录");
                });
                //获取课件分类
                kejianfl({
                  md5key: localStorage.getItem("md5key"),
                  nianji_id: this.nianji_id,
                }).then((res) => {
                  console.log(res.retRes, "课件分类");
                  if (res.retInt != 1) {
                    this.$notify.error({
                      title: "获取资源失败",
                      message: res.retErr,
                      duration: 2000,
                      showClose: false,
                    });
                  } else if (res.retInt == 1) {
                    this.kejianflList = res.retRes;
                    const allTaps = { id: 0, systypes_id: 1, title: "全部" };
                    const allTaps1 = {
                      id: 10000,
                      systypes_id: 1,
                      title: "教研课",
                    };
                    const allTaps2 = {
                      id: 10001,
                      systypes_id: 1,
                      title: "教学课",
                    };
                    this.kejianflList.unshift(allTaps); //增加一个全部的分类，这个分类获取列表不需要传课件分类和课件标签分类
                    // this.kejianflList.push(allTaps1); //增加教研课
                    this.kejianflList.push(allTaps2); //增加教学课
                    // const tuijanTaps = { id: -1, title: "推荐" };
                    // this.kejianflList.unshift(tuijanTaps); //增加一个推荐分类，这个分类用推荐列表的接口获取数据，数据包含各种类型
                    this.kejianfl_id = this.$route.query.mb_tap_id
                      ? this.$route.query.mb_tap_id
                      : res.retRes[0].id; //暂时课件分类id取第一个
                    this.mb_tapTitle =this.$route.query.mb_tapTitle
                      ? this.$route.query.mb_tapTitle: res.retRes[0].title; //分类第一用作面包屑默认筛选条件
                    console.log(
                      this.kejianflList,
                      this.kejianfl_id,
                      "调整过的课件分类列表和当前的分类id"
                    );
                    //获取进入页面后根据个人信息展示的课件列表
                    list_kejian({
                      md5key: localStorage.getItem("md5key"),
                      title: this.searchTitle,
                      kemu_id: this.kemu_id,
                      nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
                      type_id: this.systypes_id,
                      kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
                      kejianversions_id: this.kejianversions_id, //版本id
                      kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
                      kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
                      kejiantag_id: this.$route.query.mb_tag_id
                        ? this.$route.query.mb_tag_id
                        : null,
                      of: this.kejiantag_id == "new" ? "time" : "",
                      page: this.page, //页面默认1
                      page_size: this.page_size, //默认20
                    }).then((res) => {
                      if (res.retInt == 1) {
                        console.log(res, "课件列表");
                        const data = res.retRes;
                        this.kejianLists = data;
                        this.counts = res.retCounts;
                      } else {
                        this.$notify({
                          title: "暂无数据",
                          message: res.retErr,
                          duration: 2000,
                          showClose: false,
                        });
                      }
                    });
                    //获取课件列表标签
                    list_kejiantag({
                      md5key: localStorage.getItem("md5key"),
                      kejianfl_id:
                        this.kejianfl_id == 0 ? "1000000" : this.kejianfl_id, //当前课件分类id
                      kemu_id: this.kemu_id,
                      nianji_id: this.nianji_id,
                    }).then((res) => {
                      if (res.retInt != 1) {
                        this.$notify.error({
                          title: "获取资源失败",
                          message: res.retErr,
                          duration: 2000,
                          showClose: false,
                        });
                      } else if (res.retInt == 1) {
                        console.log(res, "课件分类列表标签");
                        this.kejianfltaglist = res.retRes;
                        if (res.retRes.length < 1) {
                          this.kejiantagShow = false;
                        } else {
                          this.kejiantagShow = true;
                        }
                      }
                    });
                  }
                });
              } else {
                this.$notify.error({
                  title: "获取书本失败",
                  message: res.retErr,
                  duration: 2000,
                  showClose: false,
                });
              }
            });
          } else {
            this.$notify.error({
              title: "错误",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      } else if (res.retRes.sy_end_time * 1000 < Date.parse(new Date())) {
        this.$router.push({
          name: "Login",
          query: {
            isgq: 1,
          },
        });
      }
    });
    //获取进入页面后根据个人信息展示的课件列表
    // tjlists({
    //   md5key: localStorage.getItem("md5key"),
    // }).then((res) => {
    //   if (res.retInt == 1) {
    //     console.log(res, "推荐课件列表");
    //     const data = res.retRes;
    //     this.kejianLists = data;
    //     this.counts = res.retCounts;
    //   } else {
    //     this.$notify({
    //       title: "暂无数据",
    //       message: res.retErr,
    //       duration: 2000,
    //       showClose: false
    //     });
    //   }
    // });
  },
  mounted() {
    setTimeout(() => {
      const date = new Date(); //获取当前日期
      const dateWidth = 38; //每个日期格的宽度
      const sTime = new Date(this.start_date).getTime(); //开始日期
      const eTime = new Date(this.end_date).getTime(); //结束日期
      const diffDate = eTime - sTime; //开始时间戳减去结束时间戳
      const timeLong = Math.floor(diffDate / (1000 * 3600 * 24)); //计划共多少天
      this.stime = this.timeStamp2String(sTime, 10); //计划从几号开始
      this.etime = this.timeStamp2String(eTime, 10); //计划到几号结束
      this.smonth = this.timeStamp2String(sTime, 4); //计划几月开始
      this.emonth = this.timeStamp2String(eTime, 4); //计划几月结束
      const today = new Date().getDate(); //今天几号
      this.currentMonthCount = new Date(
        date.getFullYear(),
        date.getMonth() + 1,
        0
      ).getDate(); //获取本月天数
      this.monthNow = new Date().getMonth() + 1; //本月月份
      const mask = document.getElementsByClassName("mask")[0];
      // mask.style.width = (timeLong + 1) * dateWidth + "px";
      const tips = document.getElementsByClassName("today")[0];
      //如果今天是一号，给到tips左边7px的边距
      if (today == 1) {
        tips.style.left = 7 + "px";
      } else {
        tips.style.left = (today - 1) * dateWidth + "px";
      }
      // mask.style.left = (this.stime - 1) * dateWidth + "px";
      if (this.monthNow > this.smonth && this.monthNow == this.emonth) {
        mask.style.width = this.etime * dateWidth + "px"; //结束日期之前全部选中
        mask.style.left = 0 + "px"; //1号开始
        this.scolorTime = 1; //绿色字体从1号开始
        this.ecolorTime = this.etime; //绿色字体在31号结束
        // console.log(this.etime,"哈哈哈啊哈哈哈哈哈哈")
      } else if (this.monthNow > this.smonth && this.monthNow < this.emonth) {
        mask.style.width = this.currentMonthCount * dateWidth + "px"; //本月天数全部选中
        mask.style.left = 0 + "px"; //1号开始
        this.scolorTime = 1; //绿色字体从1号开始
        this.ecolorTime = 31; //绿色字体在31号结束
      } else if (this.monthNow == this.smonth && this.monthNow == this.emonth) {
        mask.style.left = (this.stime - 1) * dateWidth + "px"; //开始日期开始
        mask.style.width = (this.etime - this.stime + 1) * dateWidth + "px"; //结束日期之前全部选中
        this.scolorTime = this.stime; //绿色字体从开始日期开始
        this.ecolorTime = this.etime; //绿色字体在结束日期结束
      } else if (this.monthNow == this.smonth && this.monthNow < this.emonth) {
        mask.style.left = (this.stime - 1) * dateWidth + "px"; //开始日期开始
        mask.style.width =
          (this.currentMonthCount - this.stime + 2) * dateWidth + "px"; //本月最后一天减去开始那天加两天
        this.scolorTime = this.stime; //绿色字体从开始日期开始
        this.ecolorTime = 31; //绿色字体在31号结束
      }
      // console.log(
      //   new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate(),
      //   "哈哈哈啊哈哈哈哈哈哈"
      // );
      console.log(this.scolorTime, this.ecolorTime);
      // this.isplanColor = date>=sTime && date<=eTime
    }, 1000);

    //监听滚动
    window.addEventListener("scroll", this.handleScrollY, true);
  },

  methods: {
    //调整教学计划
    goEditPlan() {
      this.$router.push({
        name: "MyTeachPlan",
      });
    },
    //tap栏的置顶效果
    handleScrollY() {
      // console.log(document.documentElement.scrollTop,"滚动条高度高度")
      const beikeTaps = document.getElementsByClassName("beikeTaps")[0]; //需要置顶的教师教研tap栏
      // const kejianTaps = document.getElementsByClassName("kejianTaps")[0]; //需要置顶的课件分类tap栏
      // const resFl = document.getElementsByClassName("resFl")[0]; //需要置顶的资源分类左侧栏
      // const kejianTop = document.getElementsByClassName("top")[0]; //需要置顶的资源分类左侧栏
      const dingzhi = document.getElementsByClassName("dingzhi")[0];
      const recommend = document.getElementsByClassName("recommend")[0];
      // console.log(secondTop.getBoundingClientRect().top)
      // console.log(
      //   document.getElementsByClassName("recommend")[0].getBoundingClientRect()
      //     .bottom
      // );
      // console.log(
      //   document.getElementsByClassName("dingzhi")[0].getBoundingClientRect().bottom
      // );
      const x = dingzhi.getBoundingClientRect().top;
      const y = recommend.getBoundingClientRect().bottom;

      // console.log(x, y,"15316531279189378")
      if (x <= -10 && y > 180) {
        beikeTaps.style.position = "fixed";
        // kejianTaps.style.position = "static";
        // resFl.style.position = "static";
        // kejianTop.style.position = "static"
      } else if (x > -10) {
        beikeTaps.style.position = "static";
        // kejianTaps.style.position = "static";
        // resFl.style.position = "static";
      } else if (y < 100) {
        beikeTaps.style.position = "static";
        // kejianTaps.style.position = "fixed";
        // // resFl.style.position = "fixed";
        // kejianTop.style.position = "fixed"
      }
    },
    //定制栏切换事件
    dingzhiChange(e) {
      this.dingzhiRadio = e;
      console.log(
        this.dingzhiNj_id,
        this.kemu_id,
        this.dingzhiRadio,
        this.dingzhiRadio != 4,
        this.gaosanEnglish,
        "tap值"
      );
      // 如果是高三英语
      if (
        this.dingzhiNj_id == 11 &&
        this.kemu_id == 3 &&
        this.dingzhiRadio == "1"
      ) {
        this.gaosanEnglish = true;
        setTimeout(() => {
          chapterskejian({
            md5key: localStorage.getItem("md5key"),
            kejianbooks_id: this.yilunBook_id,
          }).then((res) => {
            console.log(
              res,
              "高三英语一轮复习",
              res.retRes[0].kejian_lists[0].id
            );
            this.gs = res.retRes[0].kejian_lists[0].id;
            console.log(this.gsEn, this.beikeFlag, "asssss");
            const data = res.retRes;
            this.gsEnYlChList = [];
            this.gsEnYlYfList = [];
            this.gsEnYlChList = res.retRes[0].kejian_lists;
            this.gsEnYlYfList = res.retRes[1].kejian_lists;
          });
        }, 200);
      } else if (
        this.dingzhiNj_id == 11 &&
        this.kemu_id == 3 &&
        this.dingzhiRadio == "2"
      ) {
        this.gaosanEnglish = true;
        this.gsEnYlChList = [];
        setTimeout(() => {
          list_kejian({
            md5key: localStorage.getItem("md5key"),
            title: "",
            kemu_id: this.kemu_id,
            nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
            from_int: 10,
            // type_id: this.systypes_id,
            kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
            kejianversions_id: this.kejianversions_id,
            kejianbooks_id: this.erlunBook_id, //初始为当前,点击书本更改
            // kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
            // page: this.page, //页面默认1
            // page_size: this.page_size, //默认20
          }).then((res) => {
            console.log(res, "高三英语二轮复习");
            this.gserlunL = res.retRes[0].id;
            this.gserlunR = res.retRes[4].id;
            console.log(
              res.retRes[0].id,
              this.beikeFlag,
              "sjdghakhdashdjasjsdjk"
            );
            const data = res.retRes;
            this.gsEnYlChList = res.retRes;
          });
        }, 200);
      } else {
        this.gaosanEnglish = false;
      }
      //如果不是高三
      if (this.dingzhiNj_id != 11) {
        if (e == "1") {
          this.gyezyLists = this.zyzxMsg.info_1.zy_lists;
          this.gyespLists = this.zyzxMsg.info_1.sp_lists;
        } else if (e == "2") {
          this.gyezyLists = this.zyzxMsg.info_2.zy_lists;
          this.gyespLists = this.zyzxMsg.info_2.sp_lists;
        } else if (e == "3") {
          this.gyezyLists = this.zyzxMsg.info_3.zy_lists;
          this.gyespLists = this.zyzxMsg.info_3.sp_lists;
        }
      } else {
        if (e == "1") {
          this.gszyLists = this.zyzxMsg.info_1.zy_lists;
          // this.gs = this.zyzxMsg.info_1.zy_lists[0].id;
          this.gszxLists = this.zyzxMsg.info_1.zx_lists;
          this.gsspLists = this.zyzxMsg.info_1.sp_lists;
          console.log(this.gsspLists, "yilun 视频");
          if (this.gszyLists.length > 0) {
            this.gs = this.zyzxMsg.info_1.zy_lists[0].id;
          }
        } else if (e == "2") {
          this.gszyLists = this.zyzxMsg.info_2.zy_lists;
          // this.gs = this.zyzxMsg.info_2.zy_lists[0].id;
          this.gszxLists = this.zyzxMsg.info_2.zx_lists;
          this.gsspLists = this.zyzxMsg.info_2.sp_lists;
          console.log(this.gsspLists, "二轮 视频");
          if (this.gszyLists.length > 0) {
            this.gs = this.zyzxMsg.info_2.zy_lists[0].id;
          }
        } else if (e == "4") {
          this.gszyLists = this.zyzxMsg.info_4.zy_lists;
          // this.gs = this.zyzxMsg.info_4.zy_lists[0].id;
          this.gszxLists = this.zyzxMsg.info_4.zx_lists;
          this.gsspLists = this.zyzxMsg.info_4.sp_lists;
          console.log(this.gsspLists, "试卷 视频");
          console.log(
            "试卷试卷试卷试卷试卷试卷试卷试卷试卷试卷试卷试卷试卷试卷试卷"
          );
        }
        if (this.gszyLists.length == 0) {
          this.nothingShow = true;
        } else {
          this.nothingShow = false;
          this.gs = this.zyzxMsg.info_4.zy_lists[0].id;
        }
      }
    },
    //前往高三最新资源列表页
    gogszy() {
      console.log(
        this.dingzhiRadio,
        this.kemu_id,
        this.dingzhiNj_id,
        this.zyzxMsg.info_1.kejianbooks_id
      );
      if (this.dingzhiRadio == 1) {
        this.$router.push({
          name: "Gszy",
          query: {
            type: this.dingzhiRadio,
            kemu_id: this.kemu_id,
            nianji_id: this.dingzhiNj_id,
            kejianbooks_id: this.zyzxMsg.info_1.kejianbooks_id,
          },
        });
      } else if (this.dingzhiRadio == 2) {
        this.$router.push({
          name: "Gszy",
          query: {
            type: this.dingzhiRadio,
            kemu_id: this.kemu_id,
            nianji_id: this.dingzhiNj_id,
            kejianbooks_id: this.zyzxMsg.info_2.kejianbooks_id,
          },
        });
      } else if (this.dingzhiRadio == 4) {
        this.$router.push({
          name: "Gszy",
          query: {
            type: this.dingzhiRadio,
            kemu_id: this.kemu_id,
            nianji_id: this.dingzhiNj_id,
          },
        });
      }
      // list_kejian({
      //   md5key: localStorage.getItem("md5key"),
      //   kemu_id:this.kemu_id,
      //   nianji_id : this.nianji_id,
      //   type_id : 2,
      //   page_size:50,
      // }).then(res=>{
      //   console.log(res)
      // })
    },
    //高三英语专有的词汇语法分类查看全部
    gogszyNewCh() {
      console.log(this.cihui_id, this.yufa_id);
      this.$router.push({
        name: "Gszy",
        query: {
          type: this.dingzhiRadio,
          kemu_id: this.kemu_id,
          nianji_id: this.dingzhiNj_id,
          kejianbooks_id: this.zyzxMsg.info_1.kejianbooks_id,
          kejianchapters_id: this.cihui_id,
        },
      });
    },
    gogszyNewYf() {
      console.log(this.cihui_id, this.yufa_id);
      this.$router.push({
        name: "Gszy",
        query: {
          type: this.dingzhiRadio,
          kemu_id: this.kemu_id,
          nianji_id: this.dingzhiNj_id,
          kejianbooks_id: this.zyzxMsg.info_1.kejianbooks_id,
          kejianchapters_id: this.yufa_id,
        },
      });
    },
    //前往高三专项资源列表
    gogszx(
      kejianbooks_id,
      kejianchapters_id,
      kejianfl_id,
      kejiantag_id,
      kemu_id,
      nianji_id,
      title,
      type_id,
      index
    ) {
      //将专项数组删除点点击的那个一起传过去
      localStorage.setItem("zxArr", JSON.stringify(this.gszxLists));
      const arr = this.gszxLists;
      // arr.splice(index,1)
      //把当前选中的定制tap分类也带过去，方便判断是否是试卷
      // console.log(JSON.parse(JSON.stringify(arr)))
      this.$router.push({
        name: "Gszx",
        query: {
          kejianbooks_id: kejianbooks_id,
          kejianchapters_id: kejianchapters_id,
          kejianfl_id: kejianfl_id,
          kejiantag_id: kejiantag_id,
          kemu_id: kemu_id,
          nianji_id: nianji_id,
          title: title,
          type: this.dingzhiRadio,
          type_id: type_id,
          index: index,
        },
      });
    },
    //是否有用按钮切换事件
    youyong(e) {
      // console.log(e)
      this.yy_status = e;
      console.log(this.yy_status);
    },
    //提交反馈
    submitTest() {
      zyzxfk({
        md5key: localStorage.getItem("md5key"),
        yy_status: this.yy_status,
      }).then((res) => {
        // console.log(this.yy_status)
        this.fkshow = false;
        if (res.retInt == 1) {
          console.log(this.yy_status);
          if (this.yy_status == 1) {
            this.$notify({
              message: "感谢您的鼓励，我们会再接再厉的!",
              duration: 5000,
              showClose: false,
            });
          } else {
            this.$notify({
              message: "感谢您的建议，我们会继续努力的!",
              duration: 5000,
              showClose: false,
            });
          }
        }
      });
    },
    //鼠标移入备课资源包
    beikeMouseEnter(id) {
      this.beikeFlag = false;
      // console.log(id);
      this.n = id;
      // console.log(this.beikeFlag);
    },
    //高三非英语部分鼠标移入备课资源包
    gsbeikeMouseEnter(id) {
      console.log(id);
      this.gs = id;
    },
    //高三英语一轮词汇部分鼠标移入备课资源包
    gsbeikeMouseEnteryilunCh(id) {
      this.gsyilunCh = id;
    },
    //高三英语一轮部分语法鼠标移入备课资源包
    gsbeikeMouseEnteryilunYf(id) {
      this.gsyilunYf = id;
    },
    //高三英语二轮左边部分鼠标移入备课资源包
    gsbeikeMouseEntererlunL(id) {
      this.gserlunL = id;
      console.log(id, this.gserlunL);
    },
    //高三英语二轮左边部分鼠标移入备课资源包
    gsbeikeMouseEntererlunR(id) {
      this.gserlunR = id;
      console.log(id, this.gserlunR);
    },
    //点击切换资源库书本选择,更换当前书本id，获取相对应的目录内容
    handleBook(id) {
      console.log(id,'tit')
      this.kejianbooks_id = id;
      // this.kejianfl_id = 0;
      //获取书本目录列表
      chapterslists({
        md5key: localStorage.getItem("md5key"),
        kejianbooks_id: this.kejianbooks_id,
        // pid: this.kejianchapters_id,
      }).then((res) => {
        this.mululist = res.retRes;
        console.log(res, "书本目录");
      });
    },
    //点击不同的书本，获取书本版本对应的年级id，根据年级id 获取相对应的资源课件分类列表
    choseBook(nianji_id, title,index) {
      this.kejianfl_id = 0;
      this.mb_tapTitle = '全部';
      this.input = "";
      this.page = 1;
      this.currentPage = 1;
      this.paper_radio = "";
      this.kejiantag_id = "";
      this.kejianchapters_id = "";
      this.mb_muluTitle = '';
      console.log(this.kejianchapters_id, 12312312312);
      this.nianji_id = nianji_id;
      this.mb_bookTitle = title; //点击书本，更新筛选记录书本名
      this.bookIndex = index //点击的第几本书
      //获取课件分类
      kejianfl({
        md5key: localStorage.getItem("md5key"),
        nianji_id: nianji_id,
      }).then((res) => {
        console.log(res, "课件分类");
        if (res.retInt != 1) {
          this.$notify.error({
            title: "获取资源失败",
            message: res.retErr,
            duration: 2000,
            showClose: false,
          });
        } else if (res.retInt == 1) {
          this.kejianflList = res.retRes;
          const allTaps = { id: 0, systypes_id: 1, title: "全部" };
          const allTaps1 = { id: 10000, systypes_id: 1, title: "教研课" };
          const allTaps2 = { id: 10001, systypes_id: 1, title: "教学课" };
          this.kejianflList.unshift(allTaps); //增加一个全部的分类，这个分类获取列表不需要传课件分类和课件标签分类
          // this.kejianflList.push(allTaps1); //增加教研课
          this.kejianflList.push(allTaps2); //增加教学课
          // const tuijanTaps = { id: -1, title: "推荐" };
          // this.kejianflList.unshift(tuijanTaps); //增加一个推荐分类，这个分类用推荐列表的接口获取数据，数据包含各种类型
          // this.kejianfl_id = res.retRes[0].id; //暂时课件分类id取第一个
          console.log(
            this.kejianflList,
            this.kejianfl_id,
            "调整过的课件分类列表和当前的分类id"
          );
          //获取进入页面后根据个人信息展示的课件列表
          list_kejian({
            md5key: localStorage.getItem("md5key"),
            title: "",
            kemu_id: this.kemu_id,
            nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
            type_id: this.systypes_id,
            kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
            kejianversions_id: this.kejianversions_id,
            kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
            // kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
            page: this.page, //页面默认1
            page_size: this.page_size, //默认20
          }).then((res) => {
            if (res.retInt == 1) {
              console.log(res, "课件列表");
              const data = res.retRes;
              this.kejianLists = data;
              this.counts = res.retCounts;
            } else {
              this.$notify({
                title: "暂无数据",
                message: res.retErr,
                duration: 2000,
                showClose: false,
              });
            }
          });
          //获取课件列表标签
          list_kejiantag({
            md5key: localStorage.getItem("md5key"),
            kejianfl_id: this.kejianfl_id == 0 ? "1000000" : this.kejianfl_id, //当前课件分类id
            kemu_id: this.kemu_id,
            nianji_id: this.nianji_id,
          }).then((res) => {
            if (res.retInt != 1) {
              this.$notify.error({
                title: "获取资源失败",
                message: res.retErr,
                duration: 2000,
                showClose: false,
              });
            } else if (res.retInt == 1) {
              console.log(res, "课件分类列表标签");
              this.kejianfltaglist = res.retRes;
              if (res.retRes.length < 1) {
                this.kejiantagShow = false;
              } else {
                this.kejiantagShow = true;
              }
            }
          });
        }
      }); 
    },
    //点击切换目录
    handleNodeClick(e) {
      this.input = "";
      this.searchTitle = "";
      this.page = 1;
      this.currentPage = 1;
      this.paper_radio = "";
      this.kejiantag_id = "";
      this.kejianchapters_id = e.id;
      if (this.kejianfl_id == -1) {
        //获取进入页面后根据个人信息展示的课件列表
        // tjlists({
        //   md5key: localStorage.getItem("md5key"),
        // }).then((res) => {
        //   if (res.retInt == 1) {
        //     console.log(res, "推荐课件列表");
        //     const data = res.retRes;
        //     this.kejianLists = data;
        //     this.counts = res.retCounts;
        //   } else {
        //     this.$notify({
        //       title: "暂无数据",
        //       message: res.retErr,
        //       duration: 2000,
        //        showClose: false
        //     });
        //   }
        // });
      } else if (this.kejianfl_id == 0) {
        //获取进入页面后根据个人信息展示的课件列表
        this.kejianchapters_id = e.id;
        list_kejian({
          md5key: localStorage.getItem("md5key"),
          title: "",
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          // kejiantag_id: this.kejiantag_id, //先默认，后根据选择的标签来传
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      } else if (this.kejianfl_id > 0 && this.kejianfl_id < 10000) {
        //获取进入页面后根据个人信息展示的课件列表
        list_kejian({
          md5key: localStorage.getItem("md5key"),
          // title:'',
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          // kejiantag_id: this.kejiantag_id, //默认为一,点击选中课件标签后更改
          kejianversions_id: this.kejianversions_id, //当前版本id
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          page: 1, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            // this.kejianLists = []
            this.kejianLists = data;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      } else if (this.kejianfl_id == 10000) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 1,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      } else if (this.kejianfl_id == 10001) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 2,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      }
      console.log(e, "点击选择目录");
      this.mb_muluTitle = e.title; //点击选择目录，更新筛选目录名
    },
    //点击选中课件分类
    choseKejianfl(id, systypes_id, title) {
      console.log(id, systypes_id);
      this.mb_tapTitle = title; //点击分类，更新面包屑筛选分类名
      this.page = 1;
      this.currentPage = 1;
      this.kejianfl_id = id;
      this.systypes_id = systypes_id;
      this.paper_radio = "";
      this.kejiantag_id = "";
      console.log(this.systypes_id, "课件分类gjhgdkahdgagdhagaskhagj");
      if (id == 0) {
        //全部分类下的呢日哦那个
        this.kejiantagShow = false; //不存在课件分类标签
        //获取进入页面后根据个人信息展示的课件列表
        list_kejian({
          title: this.searchTitle ? this.searchTitle : "",
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          // kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
        //当当前课件分类id为-1，也就是推荐时，获取推荐列表
      } else if (id == -1) {
        this.kejiantagShow = false; //不存在课件分类标签
        //获取进入页面后根据个人信息展示的课件列表
        tjlists({
          md5key: localStorage.getItem("md5key"),
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "推荐课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
        //当课件分类不是推荐或者全部时，正常根据选中的获取课件列表
      } else if (id > 0 && id < 10000) {
        this.kejianfl_id = id; //赋值当前分类id
        this.systypes_id = systypes_id; //赋值当前系统课件大分类(1.课件.2.试卷.3.素材.4.专项)
        list_kejiantag({
          md5key: localStorage.getItem("md5key"),
          kejianfl_id: this.kejianfl_id,
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
        }).then((res) => {
          console.log(res, "课件分类下的分类标签");
          this.kejianfltaglist = res.retRes;
          if (res.retRes.length < 1) {
            this.kejiantagShow = false;
          } else {
            this.kejiantagShow = true;
          }
          const newTag = { id: "new", kejianfl_id: 5, title: "最新" };
          this.kejianfltaglist.unshift(newTag);
          //通过选择的分类id，和获取到的分类标签id获取课件列表
          list_kejian({
            md5key: localStorage.getItem("md5key"),
            title: this.searchTitle ? this.searchTitle : "",
            kemu_id: this.kemu_id,
            nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
            type_id: this.systypes_id,
            kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
            kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
            kejianversions_id: this.kejianversions_id,
            kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
            kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
            page: this.page, //页面默认1
            page_size: this.page_size, //默认20
          }).then((res) => {
            if (res.retInt == 1) {
              console.log(res, "课件列表");
              const data = res.retRes;
              this.kejianLists = data;
              this.counts = res.retCounts;
            } else {
              this.$notify({
                title: "暂无数据",
                message: res.retErr,
                duration: 2000,
                showClose: false,
              });
            }
          });
        });
      } else if (id == 10000) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.searchTitle ? this.searchTitle : "",
          kemu_id: this.kemu_id,
          // nianji_id:this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 1,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      } else if (id == 10001) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.searchTitle ? this.searchTitle : "",
          kemu_id: this.kemu_id,
          // nianji_id:this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 2,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      }
    },
    //选择分类下的分类标签
    choseTagfl(id, title) {
      this.mb_tagTitle = title; //点击标签，更新面包屑筛选标签名
      this.paper_radio = id;
      console.log(this.kejianfltaglist, this.paper_radio, "hahah");
      this.kejiantag_id = id;
      this.page = 1;
      this.currentPage = 1;
      //选择课件分类标签后更新课件列表课件列表
      list_kejian({
        md5key: localStorage.getItem("md5key"),
        title: this.searchTitle ? this.searchTitle : "",
        kemu_id: this.kemu_id,
        nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
        type_id: this.systypes_id,
        kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
        kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
        kejianversions_id: this.kejianversions_id,
        kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
        kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
        of: this.kejiantag_id == "new" ? "time" : "",
        page: this.page, //页面默认1
        page_size: this.page_size, //默认20
      }).then((res) => {
        if (res.retInt == 1) {
          console.log(res, "课件列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        } else {
          this.$notify({
            title: "暂无数据",
            message: res.retErr,
            duration: 2000,
            showClose: false,
          });
        }
      });
    },
    //选择教研课教学课分类下的分类标签
    chosejyjxTagfl(id, title) {
      this.mb_tagTitle = title; //点击标签，更新面包屑筛选标签名
      this.paper_radio = id;
      console.log(id, "hahah");
      this.page = 1;
      this.currentPage = 1;
      //教学课和教研课的内容
      if (this.kejianfl_id == 10000) {
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.searchTitle ? this.searchTitle : "",
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 1,
          of: id,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      } else if (this.kejianfl_id == 10001) {
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.searchTitle ? this.searchTitle : "",
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          of: id,
          jyjxtags_id: 2,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      }
    },
    //前往校验课内容
    goJiaoyanclass(jyjxk_id) {
      this.$router.push({
        name: "JiaoyanClass",
        query: {
          id: jyjxk_id,
        },
      });
    },
    // 前往备课资源包
    gokejianbaoRes(id, lx) {
      console.log(id, lx);
      if (lx == 1) {
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
            gundongTop: document.documentElement.scrollTop,
          },
        });
        window.open(href, "_blank");
      } else {
        let { href } = this.$router.resolve({
          path: "/resource/beikeziyuan",
          query: {
            id: id,
            gundongTop: document.documentElement.scrollTop,
          },
        });
        window.open(href, "_blank");
      }
    },
    //教研课最新课程排列
    newclass() {
      this.paixu_radio = 1;
    },
    //分页
    //调整每页条数
    handleSizeChange(val) {
      console.log("每页条数调整为", val);
      this.page_size = val;
      this.page = 1;
      this.currentPage = 1;
      if (this.kejianfl_id < 10000) {
        //切换每页展示课件列表条数后重新获取展示列表
        list_kejian({
          md5key: localStorage.getItem("md5key"),
          title: this.input,
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          of: this.kejiantag_id == "new" ? "time" : "",
          page: this.page, //页面默认1
          page_size: val, //默认20
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      } else if (this.kejianfl_id == 10000) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.input,
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 1,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      } else if (this.kejianfl_id == 10001) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.input,
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 2,
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      }
    },
    //跳转第几页
    handleCurrentChange(val) {
      console.log("当前页为第", val);
      this.mb_page = val
      if (this.kejianfl_id < 10000) {
        //切换后台数据第几页课件列表后重新获取展示列表
        list_kejian({
          md5key: localStorage.getItem("md5key"),
          title: this.input,
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          of: this.kejiantag_id == "new" ? "time" : "",
          page: val, //页面默认1
          page_size: this.page_size, //默认4
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      } else if (this.kejianfl_id == 10000) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.input,
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 1,
          page: val, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      } else if (this.kejianfl_id == 10001) {
        //教学课和教研课的内容
        list_jyjxk({
          md5key: localStorage.getItem("md5key"),
          title: this.input,
          kemu_id: this.kemu_id,
          nianji_id: this.nianji_id,
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id,
          kejianchapters_id: this.kejianchapters_id,
          jyjxtags_id: 2,
          page: val, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          console.log(res, "教研课列表");
          const data = res.retRes;
          this.kejianLists = data;
          this.counts = res.retCounts;
        });
      }
    },
    //搜索框回车搜索
    handleAddBook() {
      this.searchTitle = this.input.trim();
      this.page = 1;
      this.currentPage = 1;
      if (this.searchTitle && this.searchTitle != "") {
        list_kejian({
          md5key: localStorage.getItem("md5key"),
          title: this.searchTitle,
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          of: this.kejiantag_id == "new" ? "time" : "",
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      } else {
        list_kejian({
          md5key: localStorage.getItem("md5key"),
          kemu_id: this.kemu_id,
          nianji_ids: this.nianji_id, //年级id暂时因数据原因不传
          type_id: this.systypes_id,
          kejianfl_id: this.kejianfl_id, //暂时为第一个分类,点击课件分类后更改
          kejiantag_id: this.kejiantag_id == "new" ? "" : this.kejiantag_id, //默认为一,点击选中课件标签后更改
          kejianversions_id: this.kejianversions_id,
          kejianbooks_id: this.kejianbooks_id, //初始为当前,点击书本更改
          kejianchapters_id: this.kejianchapters_id, //初始为当前,点击目录更改
          of: this.kejiantag_id == "new" ? "time" : "",
          page: this.page, //页面默认1
          page_size: this.page_size, //默认20
        }).then((res) => {
          if (res.retInt == 1) {
            console.log(res, "课件列表");
            const data = res.retRes;
            this.kejianLists = data;
            this.counts = res.retCounts;
            this.counts = res.retCounts;
          } else {
            this.$notify({
              title: "暂无数据",
              message: res.retErr,
              duration: 2000,
              showClose: false,
            });
          }
        });
      }
    },
    //点击课件前往课件详情
    goresDetails(id, lx,suffix) {
      console.log(id, lx);
      //有分类型，并且类型为贝壳资源包
      if (lx && lx == 2 && suffix !='rar' && suffix !='zip') {
        let { href } = this.$router.resolve({
          path: "/resource/beikeziyuan",
          query: {
            id: id,
            gundongTop: document.documentElement.scrollTop,
            mb_bookTitle: this.mb_bookTitle, //书本名
            mb_muluTitle: this.mb_muluTitle, //书本目录名
            // mb_kewenTitle: this.mb_kewenTitle, //课文名
            mb_tapTitle: this.mb_tapTitle, //分类名
            mb_tagTitle: this.mb_tagTitle, //标签名
            bookid: this.kejianbooks_id, //书本id
            muluid: this.kejianchapters_id, //目录id
            fenleiid: this.kejianfl_id, //分类id
            tgid: this.kejiantag_id, //标签id
            njid: this.nianji_id, //选择书本的年级id
            typeid: this.systypes_id, //分类的大类型id
            searchTitle: this.searchTitle, //搜索名
            index:this.bookIndex,//第几本书
            mb_page:this.mb_page,//第几页
          },
        });
        window.open(href, "_blank");
        //有分类型，并且类型为课件
      } else if (lx && lx == 1 && suffix !='rar' && suffix !='zip') {
        // console.log("推荐课件")
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
            gundongTop: document.documentElement.scrollTop,
            mb_bookTitle: this.mb_bookTitle, //书本名
            mb_muluTitle: this.mb_muluTitle, //书本目录名
            // mb_kewenTitle: this.mb_kewenTitle, //课文名
            mb_tapTitle: this.mb_tapTitle, //分类名
            mb_tagTitle: this.mb_tagTitle, //标签名
            bookid: this.kejianbooks_id, //书本id
            muluid: this.kejianchapters_id, //目录id
            fenleiid: this.kejianfl_id, //分类id
            tgid: this.kejiantag_id, //标签id
            njid: this.nianji_id, //选择书本的年级id
            typeid: this.systypes_id, //分类的大类型id
            searchTitle: this.searchTitle, //搜索名
            index:this.bookIndex,//第几本书
            mb_page:this.mb_page,//第几页
          },
        });
        window.open(href, "_blank");
        //非推荐，全部为正常课件
      } else if(!lx && suffix !='rar' && suffix !='zip'){
        let { href } = this.$router.resolve({
          path: "/resource/resDetails",
          query: {
            id: id,
            gundongTop: document.documentElement.scrollTop,
            mb_bookTitle: this.mb_bookTitle, //书本名
            mb_muluTitle: this.mb_muluTitle, //书本目录名
            // mb_kewenTitle: this.mb_kewenTitle, //课文名
            mb_tapTitle: this.mb_tapTitle, //分类名
            mb_tagTitle: this.mb_tagTitle, //标签名
            bookid: this.kejianbooks_id, //书本id
            muluid: this.kejianchapters_id, //目录id
            fenleiid: this.kejianfl_id, //分类id
            tgid: this.kejiantag_id, //标签id
            njid: this.nianji_id, //选择书本的年级id
            typeid: this.systypes_id, //分类的大类型id
            searchTitle: this.searchTitle, //搜索名
            index:this.bookIndex,//第几本书
            mb_page:this.mb_page,//第几页
          },
        });
        window.open(href, "_blank");
      }else if( suffix =='rar' || suffix =='zip'){
        let { href } = this.$router.resolve({
          path: "/resource/zipResDetails",
          query: {
            id: id,
            gundongTop: document.documentElement.scrollTop,
            mb_bookTitle: this.mb_bookTitle, //书本名
            mb_muluTitle: this.mb_muluTitle, //书本目录名
            // mb_kewenTitle: this.mb_kewenTitle, //课文名
            mb_tapTitle: this.mb_tapTitle, //分类名
            mb_tagTitle: this.mb_tagTitle, //标签名
            bookid: this.kejianbooks_id, //书本id
            muluid: this.kejianchapters_id, //目录id
            fenleiid: this.kejianfl_id, //分类id
            tgid: this.kejiantag_id, //标签id
            njid: this.nianji_id, //选择书本的年级id
            typeid: this.systypes_id, //分类的大类型id
            searchTitle: this.searchTitle, //搜索名
            index:this.bookIndex,//第几本书
            mb_page:this.mb_page,//第几页
          },
        });
        window.open(href, "_blank");
      }
    },
  },
  beforeDestroy() {
    window.removeEventListener("scroll", this.handleScrollY, true);
  },
};
</script>
<style>
/* 弹窗相关 */
.el-message-box__headerbtn .el-message-box__close {
  display: none;
}
.el-button--primary {
  background-color: #08a579 !important;
  border-color: #08a579 !important;
}
/* .el-button--primary:hover {
  background-color: #08A579;
} */
/* 用于推荐是否有用按钮 */
.el-radio__input.is-checked .el-radio__inner {
  border-color: #08a579;
  background: #08a579;
}
.el-radio__input.is-checked + .el-radio__label {
  color: #08a579;
}
.el-radio__inner:hover {
  border-color: #08a579 !important;
}
/* 用于资源库书本选中 */
.el-tree-node__content {
  margin: 8px 0 8px 20px;
  color: #333;
  font-weight: 600;
}
.el-tree-node__label {
  font-weight: 400;
  width: 200px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.el-tree-node:focus > .el-tree-node__content {
  color: #08a579;
}
.el-tree__empty-block {
  height: 0 !important;
  display: none;
}
.el-collapse-item__wrap {
  border: 0;
  height: auto !important;
  transition: 0s;
}
.el-collapse-item__content {
  padding-bottom: 0;
  height: auto !important;
}
.el-input.is-active .el-input__inner,
.el-input__inner:focus {
  border-color: #ccc;
}
.el-collapse {
  border-top: 0;
}

/* 用于分页 */
.el-select-dropdown__item.selected {
  color: #08a579 !important;
}
.el-pagination__editor.el-input .el-input__inner {
  border-color: #ccc;
}
.page1 {
  width: 800px;
  margin: 0 auto;
}
.el-pagination {
  text-align: center;
  margin: 20px 80px 20px 0;
}
.el-select .el-input.is-focus .el-input__inner {
  border-color: #08a579 !important;
}
.el-pagination .el-select .el-input .el-input__inner:hover {
  border-color: #08a579 !important;
}
.el-select .el-input__inner:focus {
  border-color: #08a579 !important;
}
.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #08a579 !important;
}
.el-pagination.is-background .el-pager li:not(.disabled).active:hover {
  color: #fff;
}
.el-pager li:hover {
  color: #08a579 !important;
}
.el-pagination.is-background .el-pager li:not(.disabled).active:hover {
  color: #fff !important;
}
</style>
<style lang="less" scoped>
#container {
  input::-webkit-input-placeholder {
    /* WebKit browsers*/
    color: green;
    background-color: #f9f7f7;
    font-size: 14px;
  }
  input:-moz-input-placeholder {
    /* Mozilla Firefox 4 to 18*/
    color: green;
    background-color: #f9f7f7;
    font-size: 14px;
  }
  input::-moz-input-placeholder {
    /* Mozilla Firefox 19+*/
    color: green;
    background-color: #f9f7f7;
    font-size: 14px;
  }

  input:-ms-input-placeholder {
    /* Internet Explorer 10+*/
    color: green;
    background-color: #f9f7f7;
    font-size: 14px;
  }
  .el-input__inner {
    border: 1px solid #dcdfe6 !important;
  }
  width: 100%;

  .gaoyier,
  .gaosan {
    overflow: hidden;
    .resTop {
      margin: 0 auto;
      margin-top: 20px;
      width: 100%;
      // margin-top: 36px;
      width: 1200px;
      padding: 0;
      background: #fff;
      border-radius: 8px 8px 1px 1px;
      overflow: hidden;
      .beikeTaps {
        position: static;
        top: 80px;
        // text-align: center;
        height: 60px;
        padding-top: 20px;
        background-color: #fff;
        z-index: 100000;
        // box-shadow:inset 0 -4px 5px -3px #08a579;
      }
      /deep/.el-radio-group {
        display: inline-block;
        width: 1200px;
        height: 48px;
        background: #f0f2f5;
      }
      /deep/.el-radio-button__inner {
        display: inline-block;
        padding: 0;
        margin: 0;
        text-align: center;
        width: 400px;
        height: 48px;
        line-height: 48px;
        font-size: 16px;
        background: #f0f2f5;
        color: #969799;
        font-weight: bold;
        border: 0;
        border-radius: 8px 8px 0px 0px;
        box-shadow: 0px 0 0 0 #ccc;
        .el-radio-button__orig-radio,
        input {
          width: 400px;
          height: 48px;
          border-radius: 8px 8px 0px 0px;
        }
        img {
          position: relative;
          top: -12px;
          left: 0px;
        }
        div {
          img {
            position: relative;
            top: 2px;
            left: -7px;
          }
        }
      }
      .head {
        display: flex;
        justify-content: space-between;
        margin-top: 30px;
        margin-left: 20px;

        .title {
          display: flex;
          h4 {
            font-size: 16px;
            font-family: Microsoft YaHei;
            font-weight: 400;
            color: #08a579;
          }
          p {
            font-size: 16px;
            font-family: Microsoft YaHei;
          }
          img {
            margin-left: 18px;
            width: 60px;
            height: 24px;
          }
        }
        .change {
          margin-right: 20px;
          text-align: center;
          line-height: 28px;
          width: 128px;
          height: 28px;
          background: #ebfaf5;
          border-radius: 14px;
          font-size: 14px;
          font-family: Microsoft YaHei;
          color: #08a579;
          cursor: pointer;
          user-select: none;
          img {
            position: relative;
            top: 1px;
            width: 14px;
            height: 14px;
          }
        }
      }
      .monthNow {
        margin-left: 20px;
        margin-top: 20px;
        font-size: 12px;
        color: #08a579;
      }
      .dateNow {
        position: relative;
        display: flex;
        margin-top: 10px;
        line-height: 42px;
        width: 1200px;
        height: 41px;
        background: #ffffff;
        border: 1px solid #dee0e3;
        span {
          display: inline-block;
          margin: 0 10px;
          text-align: center;
          width: 18px;
          font-size: 14px;
          font-weight: 600;
          color: #969699;
        }
        .planDate {
          color: #08a579;
        }
        // span:nth-child(-n + 12) {
        //   color: #08a579;
        // }
        .mask {
          position: absolute;
          top: -1px;
          left: 0;
          width: 0px;
          height: 41px;
          background: #ebfaf5;
          border: 1px solid #08a579;
          opacity: 0.5;
          z-index: 10;
        }
        img {
          position: absolute;
          top: 50%;
          left: 168px;
          transform: translateY(-50%);
          width: 28px;
          height: 28px;
          background: #08a579;
          border-radius: 50%;
          z-index: 11;
        }
      }
      .dingzhi {
        display: flex;
        justify-content: space-between;
        margin-top: 40px;
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid #ccc;
        .title2 {
          display: flex;
          h2 {
            margin-left: 20px;
            margin-right: 20px;
            font-size: 24px;
          }
          span {
            font-size: 14px;
            line-height: 34px;
            margin-right: 20px;
            a {
              margin-right: 5px;
              font-size: 20px;
              color: #f6444e;
              font-weight: 900;
            }
          }
        }
        p {
          margin-right: 20px;
          font-size: 14px;
          line-height: 34px;
          color: #969799;
        }
      }
    }
    .gsContents {
      display: flex;
      justify-content: space-between;
      margin: 0 auto;
      width: 1200px;
      min-height: 430px;
      background: #fff;
      overflow: hidden;
      .left {
        width: 590px;
        background-color: #fff;
        line-height: 40px;
        .leftTitle {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-bottom: 30px;
          background: #f0f2f5;
          h2 {
            padding-left: 20px;
            font-size: 16px;
            color: #333;
          }
          span {
            display: inline-block;
            margin-right: 15px;
            font-size: 14px;
            color: #969699;
            cursor: pointer;
          }
          span:hover {
            color: #08a579;
          }
        }

        .gsResbox {
          .kejianBox1 {
            display: flex;
            align-items: center;
            margin-left: 20px;
            margin-bottom: 0px;
            width: 550px;
            height: 124px;
            background: #f9f9f9;
            border-radius: 10px;
            cursor: pointer;
            .kejianfile {
              margin-left: 20px;
              height: 84px;
              img {
                width: 74px;
                height: 84px;
              }
            }
            .msg {
              margin-left: 20px;
              .title {
                margin-top: 8px;
                width: 402px;
                font-size: 14px;
                line-height: 22px;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                overflow: hidden;
                text-overflow: ellipsis;
                -webkit-box-orient: vertical;
              }
              .bottom {
                color: #939599;
                .seeNum {
                  margin-left: 30px;
                  i {
                    display: inline-block;
                    margin-right: 6px;
                  }
                }
              }
            }
          }
          .kejianBox1:hover {
            .title {
              color: #08a579;
            }
          }
          .kejianBox2 {
            display: flex;
            margin-bottom: 8px;
            align-items: center;
            height: 50px;
            .kejianfile {
              display: flex;
              align-items: center;
              margin-left: 20px;
              height: 20px;
              img {
                width: 18px;
                height: 20px;
              }
            }
            .title {
              width: 450px;
              font-size: 15px;
              color: #333;
              overflow: hidden;
              white-space: nowrap;
              text-overflow: ellipsis;
            }
            span {
              color: #939599;
            }
          }
        }
        .nothingGszy {
          text-align: center;
        }
      }
      .gserlunTips {
        .leftTitle {
          position: relative;
          left: -30px;
          width: 620px;
        }
      }
      // .gserlun{
      //   width: 800px;
      //   .gsResbox {
      //     .kejianBox1 {
      //       display: flex;
      //       align-items: center;
      //       margin-left: 20px;
      //       margin-bottom: 0px;
      //       width: 800px;
      //       height: 124px;
      //       background: #f9f9f9;
      //       border-radius: 10px;
      //       cursor: pointer;
      //       .kejianfile {
      //         margin-left: 20px;
      //         height: 84px;
      //         img {
      //           width: 74px;
      //           height: 84px;
      //         }
      //       }
      //       .msg {
      //         margin-left: 20px;
      //         .title {
      //           margin-top: 8px;
      //           width: 600px;
      //           font-size: 14px;
      //           line-height: 22px;
      //           display: -webkit-box;
      //           -webkit-line-clamp: 2;
      //           overflow: hidden;
      //           text-overflow: ellipsis;
      //           -webkit-box-orient: vertical;
      //         }
      //         .bottom {
      //           color: #939599;
      //           .seeNum {
      //             margin-left: 30px;
      //             i {
      //               display: inline-block;
      //               margin-right: 6px;
      //             }
      //           }
      //         }
      //       }
      //     }
      //     .kejianBox1:hover {
      //       .title {
      //         color: #08a579;
      //       }
      //     }
      //     .kejianBox2 {
      //       display: flex;
      //       margin-bottom: 8px;
      //       align-items: center;
      //       height: 50px;
      //       .kejianfile {
      //         display: flex;
      //         align-items: center;
      //         margin-left: 20px;
      //         height: 20px;
      //         img {
      //           width: 18px;
      //           height: 20px;
      //         }
      //       }
      //       .title {
      //         width: 600px;
      //         font-size: 15px;
      //         color: #333;
      //         overflow: hidden;
      //         white-space: nowrap;
      //         text-overflow: ellipsis;
      //       }
      //       span {
      //         color: #939599;
      //       }
      //     }
      //   }
      // }
      .right {
        width: 590px;
        background: #fff;
        line-height: 40px;
        h2 {
          padding-left: 20px;
          margin-bottom: 30px;
          width: 570px;
          font-size: 16px;
          color: #333;
          background: #f0f2f5;
        }
        .gsResbox {
          display: flex;
          flex-wrap: wrap;
          .picTap1 {
            margin-left: 20px;
            margin-bottom: 20px;
            height: 100px;
            cursor: pointer;
            img {
              width: 170px;
              height: 100px;
            }
          }
          .picTap2 {
            margin-left: 20px;
            margin-bottom: 20px;
            cursor: pointer;
            img {
              width: 170px;
              // height: 160px;
            }
          }
        }
      }
    }
    .recommend {
      width: 1200px;
      margin: 0 auto;
      // padding-top: 20px;
      background-color: #fff;
      // border-radius: 10px;
      overflow: hidden;
      .recommend {
        // margin-top: 20px;
        .someRecommend {
          .resMsg {
            margin-bottom: 10px;
            background: #ffffff;
            // border: 1px solid #dee0e3;
            .msg {
              width: 1170px;
              padding: 20px 0 40px 20px;
              background-color: #fff;
              p {
                font-size: 14px;
                font-family: Microsoft YaHei;
                color: #646566;
              }
            }
            .nothing {
              text-align: center;
            }
            .littleTittle {
              width: 1200px;
              height: 40px;
              background-color: #f0f2f5;
              h3 {
                margin-left: 20px;
                font-size: 16px;
                font-family: Microsoft YaHei;
                font-weight: bold;
                color: #333333;
                line-height: 40px;
              }
            }
            .beike {
              margin: 10px auto;
              border-radius: 10px;
              width: 1150px;
              background-color: #fff;
              .beike1 {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 20px 0;
                // width: 1160px;
                // height: 264px;
                background: #f9f9f9;
                border-radius: 10px;
                .left {
                  text-align: center;
                  width: 156px;
                  img {
                    width: 80px;
                    height: 80px;
                  }
                }
                .details {
                  display: flex;
                  flex-direction: column;
                  justify-content: space-around;
                  width: 639px;
                  .title {
                    display: flex;
                    margin: 0;
                    line-height: 34px;
                    span {
                      display: inline-block;
                      // position: relative;
                      // top: 8px;
                      margin-top: 8px;
                      margin-right: 10px;
                      width: 48px;
                      height: 20px;
                      background: #f85230;
                      border-radius: 4px;
                      font-size: 14px;
                      color: #ffffff;
                      line-height: 20px;
                      text-align: center;
                    }
                    h3 {
                      // margin-left: 10px;
                      width: 600px;
                      font-size: 16px;
                      font-weight: bold;
                      color: #333333;
                      overflow: hidden;
                      text-overflow: ellipsis;
                      display: -webkit-box;
                      -webkit-box-orient: vertical;
                      -webkit-line-clamp: 2;
                      cursor: pointer;
                    }
                    h3:hover {
                      color: #08a579;
                    }
                  }
                  .msg {
                    padding: 0;
                    width: 700px;
                    font-size: 14px;
                    color: #626366;
                    background-color: #f9f9f9;
                    p {
                      margin-bottom: 20px;
                      font-size: 14px;
                      // height: 120px;
                      line-height: 24px;
                      overflow: hidden;
                    }
                    .shengluehao {
                      display: inline-block;
                      margin-bottom: 20px;
                    }
                    .bottom {
                      color: #939599;
                      font-size: 12px;
                      .upTime {
                        margin-right: 29px;
                      }
                      .seeNum {
                        margin-right: 30px;
                        i {
                          margin-right: 5px;
                        }
                      }
                      .recNum {
                        a {
                          color: red;
                        }
                      }
                    }
                  }
                }
                .seeAll {
                  text-align: center;
                  width: 260px;
                  height: 110px;
                  border-left: 1px solid #e6e6e6;
                  cursor: pointer;
                  span {
                    display: inline-block;
                    margin-top: 30px;
                    text-align: center;
                    width: 120px;
                    height: 40px;
                    background: #08a579;
                    border-radius: 4px;
                    color: #ffffff;
                    font-size: 14px;
                    line-height: 40px;
                  }
                }
              }
              .beike2 {
                display: flex;
                align-items: center;
                padding: 20px 0;
                background-color: #fff;
                img {
                  margin: 0 40px 0 50px;
                  width: 60px;
                  height: 60px;
                }
                .details {
                  display: flex;
                  flex-direction: column;
                  justify-content: space-between;
                  min-height: 60px;
                  .title {
                    display: flex;
                    margin: 0;
                    span {
                      display: inline-block;
                      // position: relative;
                      // top: 2px;
                      margin-top: 2px;
                      width: 40px;
                      height: 20px;
                      background: #f85230;
                      border-radius: 4px;
                      font-size: 14px;
                      color: #ffffff;
                      line-height: 20px;
                      text-align: center;
                    }
                    h3 {
                      margin-left: 5px;
                      width: 600px;
                      font-size: 16px;
                      font-weight: bold;
                      color: #333333;
                      overflow: hidden;
                      text-overflow: ellipsis;
                      display: -webkit-box;
                      -webkit-box-orient: vertical;
                      -webkit-line-clamp: 2;
                    }
                  }
                  .msg {
                    padding-left: 0;
                    padding: 0;
                  }
                  .bottom {
                    color: #939599;
                    font-size: 12px;
                    .upTime {
                      margin-right: 29px;
                    }
                    .seeNum {
                      margin-right: 30px;
                      i {
                        margin-right: 5px;
                      }
                    }
                    .recNum {
                      a {
                        color: red;
                      }
                    }
                  }
                }
              }
            }
            .jiaoyan {
              display: flex;
              justify-content: space-between;
              flex-wrap: wrap;
              padding: 30px 0 10px 0;
              width: 1200px;
              .box {
                margin-bottom: 20px;
                background-color: #fff;
                border-radius: 10px;
                cursor: pointer;
                img {
                  margin-bottom: 10px;
                  width: 360px;
                  height: 203px;
                  border-radius: 10px;
                }
                .activename {
                  margin-bottom: 18px;
                  width: 320px;
                  font-size: 16px;
                  font-family: Microsoft YaHei;
                  color: #333333;
                }
                p {
                  font-size: 14px;
                  color: #939599;
                }
              }
              .box:hover {
                // transition: 1s;
                img {
                  transition: 0.5s;
                  // position: relative;
                  // top: -10px;
                  transform: translateY(-10px);
                  box-shadow: 0px 2px 10px 2px #dedede;
                }
                .activename {
                  color: #08a579;
                }
              }
            }
          }
          .active {
            display: flex;
            margin-bottom: 34px;
            border-bottom: 1px solid #dee0e3;
            .top {
              margin-bottom: 20px;
              background-color: #fff;
              span {
                position: relative;
                top: 25px;
                display: inline-block;
                width: 4px;
                height: 20px;
                background: #08a579;
                border-radius: 2px;
              }
              h2 {
                margin-left: 20px;
              }
            }
            .left {
              width: 800px;
              .content {
                display: flex;
                img {
                  width: 360px;
                  height: 186px;
                  border-radius: 10px;
                  background-color: #ccc;
                }
                .msg {
                  margin-left: 20px;
                  h2 {
                    margin-bottom: 10px;
                    font-family: Microsoft YaHei;
                    width: 353px;
                    height: 45px;
                    font-size: 16px;
                    color: #333333;
                  }
                  p {
                    margin-bottom: 10px;
                    text-align: center;
                    width: 150px;
                    height: 24px;
                    background: #fdeff0;
                    border-radius: 4px;
                    font-size: 14px;
                    color: #f63842;
                    line-height: 24px;
                  }
                  span {
                    display: block;
                    color: #939599;
                    font-size: 14px;
                  }
                  button {
                    margin-top: 37px;
                    width: 140px;
                    height: 40px;
                    background: #f85230;
                    border-radius: 4px;
                    border: 0;
                    color: #ffffff;
                  }
                }
              }
            }
            .right {
              width: 400px;
            }
          }
        }
        .test {
          display: flex;

          margin-left: 20px;
          margin-bottom: 40px;
          line-height: 36px;
          width: 540px;
          height: 36px;
          background: #ffffff;
          border: 1px solid #dee0e3;
          border-radius: 4px;
          p {
            margin-left: 21px;
            margin-right: 50px;
            color: #646566;
            font-size: 14px;
          }
          .el-radio {
            margin-top: 10px;
            // margin-left: 35px;
          }
          button {
            position: relative;
            left: 103px;
            width: 80px;
            height: 36px;
            color: #ffffff;
            background: #08a579;
            border: 0;
            border-radius: 4px;
            cursor: pointer;
          }
        }
      }
    }
  }
  .ziyuanku {
    margin: 0 auto;
    margin-top: 20px;
    width: 1200px;
    .top {
      position: static;
      top: 80px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      // margin: 20px auto;
      margin-bottom: 0;
      padding-bottom: 20px;
      width: 1200px;
      background-color: #fff;
      border-top-right-radius: 10px;
      border-top-left-radius: 10px;
      border-bottom: 1px solid #e1e3e5;
      z-index: 1000;
      .title {
        display: flex;
        margin-left: 20px;
        margin-top: 40px;

        h3 {
          margin-right: 20px;
          font-size: 24px;
        }
        h4 {
          font-size: 24px;
          color: #f6444e;
        }
        span {
          margin-right: 14px;
          font-size: 13px;
          line-height: 35px;
          color: #646566;
        }
        p {
          line-height: 35px;
          font-size: 14px;
          color: #969799;
        }
      }
      .search {
        margin-top: 40px;
        margin-right: 20px;
        /deep/ .el-input__inner {
          border-radius: 30px;
        }
      }
    }
  }
  .content {
    display: flex;
    width: 1200px;
    margin: 0 auto;
    padding-top: 20px;
    margin-bottom: 20px;
    background-color: #fff;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    .resFl {
      width: 300px;
      min-height: 1000px;
      border-radius: 10px;
      background-color: #fff;
      /deep/.el-icon-arrow-right:before {
        content: "" !important;
      }
      h2 {
        padding-left: 20px;
        color: #333333;
        background-color: #f0f2f5;
        border: 1px solid #dee0e3;
        border-radius: 10px 10px 0px 0px;
        line-height: 46px;
      }
      .box {
        border-radius: 10px;
        cursor: pointer;
        border: 1px solid #dee0e3;
        border-radius: 0px 0px 10px 10px;
        min-height: 800px;
        border-top: 0;
        .title {
          display: flex;
          justify-content: space-between;
          align-items: center;
          width: 280px;
          h3 {
            margin-left: 20px;
            font-size: 17px;
          }
          i {
            font-size: 20px;
          }
        }
        .books_chose {
          color: #08a579;
        }
      }
    }
    .right {
      margin: 0 auto;
      .kejianTaps {
        // position: fixed;
        top: 116px;
        display: flex;
        align-items: center;
        // position: static;
        // width: 916px;
        z-index: 10000;
        height: 48px;
        border-bottom: 1px solid #e6e6e6;
        background-color: #fff;
        .flname {
          cursor: pointer;
          user-select: none;
          span {
            display: inline-block;
            padding: 0 25px;
            height: 16px;
            line-height: 16px;
            color: #939599;
            font-size: 15px;
            border-right: 1px solid #e1e2e6;
            a {
              display: inline-block;
              padding-bottom: 14px;
              border-bottom: 2px solid #fff;
            }
            .fenlei_color {
              border-color: #08a579;
              color: #333333;
            }
          }
        }
        .flname:first-of-type {
          span {
            padding-left: 20px;
          }
        }
        .flname:last-of-type {
          span {
            border-right: 0;
          }
        }
      }
      //试卷分类
      .paper {
        margin-top: 20px;
        .taps2 {
          width: 800px;
          span {
            display: inline-block;
            margin-right: 19px;
            margin-bottom: 10px;
            font-size: 14px;
            color: #646566;
            cursor: pointer;
            user-select: none;
          }
          .paixu_color {
            color: #08a579;
          }
        }
      }
      //课件类资源样式
      .kejianlist {
        width: 800px;
        // height: 800px;
        -ms-overflow-style: none; /* IE 10+ */
        scrollbar-width: none; /* Firefox */
        overflow-y: scroll;
        .kejianBox {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-top: 20px;
          padding-bottom: 20px;
          border-bottom: 1px dashed #e6e6e6;
          cursor: pointer;
          .kejianfile {
            text-align: center;
            width: 140px;
            height: 140px;
            // background: linear-gradient(0deg, #e6e6e6, #ffffff);
            // border: 1px solid #ededed;
            img {
              position: relative;
              top: 50%;
              // left: 50%;
              transform: translateY(-50%);
              width: 74px;
              height: 84px;
            }
          }
          .msg {
            flex: 1;
            display: flex;
            flex-direction: column;
            margin-left: 20px;
            border-right: 1px solid #e6e6e6;
            cursor: pointer;
            .title {
              margin-bottom: 10px;
              // margin-top: 8px;
              width: 440px;
              font-size: 15px;
              font-weight: 900;
              color: #333;
              overflow: hidden;
              white-space: wrap;
              text-overflow: ellipsis;
              display: -webkit-box;
              -webkit-line-clamp: 3; /*想省略几行就写几*/
              -webkit-box-orient: vertical;
            }
            p {
              width: 480px;
              // min-height: 80px;
              line-height: 20px;
              font-size: 13px;
              color: #666;
              overflow: hidden;
              text-overflow: ellipsis;
              display: -webkit-box;
              -webkit-line-clamp: 4;
              -webkit-box-orient: vertical;
            }
            .bottom {
              display: flex;
              align-items: center;
              margin-top: 10px;
              // position: relative;
              // top: 80px;
              color: #999;
              .upTime {
                margin-right: 20px;
              }
              .seeNum {
                i {
                  margin-right: 5px;
                }
              }
              .rate{
                display: flex;
                margin-right: 38px;
                width: 148px;
              }
              /deep/.el-rate__icon{
                margin-right: 0;
              }
            }
          }
          .downLoad {
            margin: 0px 30px 0 30px;
            width: 96px;
            height: 28px;
            color: #fff;
            text-align: center;
            line-height: 28px;
            background: #08a579;
            border-radius: 14px;
            background: #08a579;
            border-radius: 14px;
            cursor: pointer;
          }
          .jiaoyan {
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap;
            padding: 30px 0 10px 0;
            width: 1200px;
            .box {
              margin-bottom: 20px;
              background-color: #fff;
              border-radius: 10px;
              cursor: pointer;
              img {
                margin-bottom: 10px;
                width: 360px;
                height: 203px;
                border-radius: 10px;
              }
              .activename {
                margin-bottom: 18px;
                width: 320px;
                font-size: 16px;
                font-family: Microsoft YaHei;
                color: #333333;
              }
              p {
                font-size: 14px;
                color: #939599;
              }
            }
            .box:hover {
              // transition: 1s;
              img {
                transition: 0.5s;
                // position: relative;
                // top: -10px;
                transform: translateY(-10px);
                box-shadow: 0px 2px 10px 2px #dedede;
              }
              .activename {
                color: #08a579;
              }
            }
          }
        }
      }
      ::-webkit-scrollbar {
        display: none; /* Chrome Safari */
      }
      //课件列表鼠标移动的样式
      .kejianBox:hover {
        .msg {
          .title {
            color: #08a597;
          }
        }
      }
      //空数据的展示
      .nothing {
        width: 800px;
        height: 400px;
        text-align: center;
        p {
          font-size: 16px;
          color: #333;
          margin-top: 50px;
        }
        img {
          margin-top: 100px;
          width: 280px;
        }
      }

      //教研课
      .classBox {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-top: 25px;
        .box {
          cursor: pointer;
          margin-bottom: 30px;
          background-color: #fff;
          border-radius: 10px;
          img {
            margin-bottom: 16px;
            width: 270px;
            height: 140px;
          }
          .activename {
            margin-bottom: 17px;
            width: 250px;
            font-size: 16px;
            font-family: Microsoft YaHei;
            color: #333333;
          }
          p {
            font-size: 14px;
            color: #939599;
          }
        }
      }
    }
  }
}
</style>
